jQWidgets Forums

This topic contains 4 replies, has 2 voices, and was last updated by Peter Stoev 11 years, 11 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)

Author

Cannot get data from local JSON Posts

May 3, 2013 at 8:28 am Cannot get data from local JSON #20523

Member

Hi,
I’m trying to get data from local JSON, like this:

var Lib = {
    list:[ {id:1,label:"Demo1",value:"aaa"}, {id:2,label:"Demo2",value:"bbb"} ],
    [... many other methods ...]
};

I want to create a ComboBox from this data:

$("listCombo").jqxComboBox({source:Lib.list,displayMember:"label",valueMember:"value",width:50,theme"ui-redmond"});

but when I click on ComboBox, I get this error on console:

Uncaught TypeError: Cannot read property 'items' of null

I’m trying to use DataAdapter, but not works. The code used is this one:

       var source = { 
		localdata: Lib.list,
		id:"id",
		datatype: "json"
		datafields:[ {name:"id"}, {name:"label"}, {name:"value"} ] 
	};
	dataSource = new $.jqx.dataAdapter(sourceFps);
        $("#listCombo").jqxComboBox({source:dataSource, displayMember:"label", valueMember:"value", width:50, theme:"ui-redmond"} );

Could you help me? Thanks.

May 3, 2013 at 10:55 am Cannot get data from local JSON #20529

Peter Stoev

Keymaster

Hi,

There is something strange in that code because you create the dataAdapter from a source object which is undefined.

According to me, the declaration should be:


var dataSource = new $.jqx.dataAdapter(source);

Best Regards,
Peter Stoev

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

May 3, 2013 at 12:02 pm Cannot get data from local JSON #20531

klodenet

Member

You are right, the code is correct on my file Js. I’ve erroneous write by hand the code, without check it.
sorry for the inconvenience. Instead, the code on my file is:

         var sourceFps = { 
		localdata: Lib.list,
		id:"id",
		datatype: "json"
		datafields:[ {name:"id"}, {name:"label"}, {name:"value"} ] 
	};
	dataSource = new $.jqx.dataAdapter(sourceFps);
        $("#listCombo").jqxComboBox({source:dataSource, displayMember:"label", valueMember:"value", width:50, theme:"ui-redmond"} );

In particular, Lib.list is an array of object.

Have you tried to use this code, for a test?

May 4, 2013 at 2:12 pm Cannot get data from local JSON #20561

klodenet

Member

Someone can help me using a local JSON data?

May 4, 2013 at 4:45 pm Cannot get data from local JSON #20564

Peter Stoev

Keymaster

Hi,

Here’s a working sample based on your code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta name="keywords" content="jQuery ComboBox, List, ComboBox, Popup List, jqxDropDownList, jqxListBox, List Widget, ListBox Widget, DropDownList Widget" />
    <meta name="description" content="In this demo the ComboBox is bound to JSON data" />
    <title id='Description'>In this demo the ComboBox is bound to JSON data.</title>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <script type="text/javascript" src="../../scripts/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcombobox.js"></script>
</head>
<body>
    <div id='content'>
        <script type="text/javascript">
            $(document).ready(function () {
                var theme = getDemoTheme();
                var Lib = {
                    list: [{ id: 1, label: "Demo1", value: "aaa" }, { id: 2, label: "Demo2", value: "bbb" }]
                };
                var source = { 
                    localdata: Lib.list,
                    id:"id",
                    datatype: "json",
                    datafields:[ {name:"id"}, {name:"label"}, {name:"value"} ] 
            };
                var dataSource = new $.jqx.dataAdapter(source);
                // Create a jqxComboBox
                $("#jqxWidget").jqxComboBox({ selectedIndex: 0, source: dataSource, displayMember: "label", valueMember: "value", width: 200, height: 25, theme: theme });
              
            });
        </script>
        <div id='jqxWidget'>
        </div>
        <div style="font-size: 12px; font-family: Verdana;" id="selectionlog"></div>
    </div>
</body>
</html>

Best Regards,
Peter Stoev

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

Author

Posts

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.