jqxcombobox combobox issue for .NET MVC VS2010

[gpalimaMember]

Hi,

I am running to an issue when I try to use this  tool JS widger Combobox.

I have added all the necessary  JS script file  in my .net Razor code but whenever I ran the

site it always gives me an err   Line: 7
Error: ‘jqx’ is null or not an object

I commented out the script below  and my code started to run but no data on combobox

 <scriptsrc=”@Url.Content(“../../Scripts/JQwidgets/jqxbuttons.js”)”type=”text/javascript”></

I think the culprit to this issue is the jqxbuttons.JS.. I  copied the sample HTM file bindingtojson.htm inside my  project file and  have no issue running it but on .net MVC Razor it always show an error of    Line: 7
Error: ‘jqx’ is null or not an object

 

Thanks!

 

 

snippet of my code

 @{
    ViewBag.Title = “Index”;
    Layout = null;
�
     �
   <script src=”@Url.Content(“~/Scripts/JQwidgets/gettheme.js”)” type=”text/javascript”></script>
   <script src=”@Url.Content(“../../Scripts/JQwidgets/jqxbuttons.js”)” type=”text/javascript”></script>
   <script src=”@Url.Content(“~/Scripts/JQwidgets/jqxcore.js”)” type=”text/javascript”></script>
   <script src=”@Url.Content(“~/Scripts/JQwidgets/jqxdata.js”)” type=”text/javascript”></script>
   <script src=”@Url.Content(“~/Scripts/JQwidgets/jqxscrollbar.js”)” type=”text/javascript”></script>
   <script src=”@Url.Content(“~/Scripts/JQwidgets/jqxcombobox.js”)” type=”text/javascript”></script>
   <script src=”@Url.Content(“~/Scripts/JQwidgets/jqxlistbox.js”)” type=”text/javascript”></script>
 �
  �
  �
}
<h2>
    Index</h2>
      <div id=’jqxWidget’>
        </div>
        <div style=”font-size: 12px; font-family: Verdana;” id=”selectionlog”></div>
 

<script type=”text/javascript”>
�
         $(document).ready(function () {
                var theme = getDemoTheme();

                var url = “customers.txt”;

                // prepare the data
                var source =
                {
                    datatype: “json”,
                    datafields: [
                        { name: ‘CompanyName’ },
                        { name: ‘ContactName’ }
                    ],
                    id: ‘id’,
                    url: url,
                    async: false
                };
                var dataAdapter = new $.jqx.dataAdapter(source);

                // Create a jqxComboBox
                $(“#jqxWidget”).jqxComboBox({ selectedIndex: 0, source: dataAdapter, displayMember: “ContactName”, valueMember: “CompanyName”, width: 200, height: 25, theme: theme });

                // trigger the select event.
                $(“#jqxWidget”).on(‘select’, function (event) {
                    if (event.args) {
                        var item = event.args.item;
                        if (item) {
                            var valueelement = $(“<div></div>”);
                            valueelement.text(“Value: ” + item.value);
                            var labelelement = $(“<div></div>”);
                            labelelement.text(“Label: ” + item.label);

                            $(“#selectionlog”).children().remove();
                            $(“#selectionlog”).append(labelelement);
                            $(“#selectionlog”).append(valueelement);
                        }
                    }
                });
            });

          �
 </script>
 

 

 

[Peter StoevKeymaster]

Hi,

Thanks for writing.

1. getDemoTheme() is a function used in our Online samples. That is the reason it is called getDemoTheme. That should not be used when using jQWidgets. For setting a theme, you may take a look at the Styling and Appearance help documentation topics available on our web site.
2. jqxbuttons.js is loaded before jqxcore.js. That is not correct because jqxbutton.js uses jqxcore.js. The same is valid for the jqxcombobox.js and jqxlistbox.js.
3. Please, take a look at (4.) in this help topic: http://www.jqwidgets.com/jquery-widgets-documentation/documentation/asp.net-integration/asp.net-grid-server-side-editing.htm. It shows how to add references to the jQWidgets JavaScript files in MVC3 Application.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[Author]

Posts