Binding to a grid

[RedantJParticipant]

In the past, I have used the following code:

var listFoo = [
{ label: "Mary", value: "1"},
{ label: "Frank", value: "2"},
{ label: "Alice", value: "3"}
];

var sourceFoo =
{
	datatype: "array",
	datafields: [
		{ name: 'label', type: 'string' },
		{ name: 'value', type: 'string' }
	],
	localdata: listFoo
};

var adapterFoo = new $.jqx.dataAdapter(sourceFoo, {
	autoBind: true
});

var source =
{
	datatype: "json",
	datafields: [
		{ name: 'FooID', value: 'Foo', values: {source: adapterFoo.records, value: 'value', name: 'label'} },
		{ name: 'Foo', type: 'string'},
		{ name: 'Bar', type: 'string' },
		{ name: 'Taa', type: 'string' }
	],
	cache: false,
	url: './data/foobar.asp',
	filter: function()
	{
		// update the grid and send a request to the server.
		$("#jqxgrid").jqxGrid('updatebounddata', 'filter');
	},
	sort: function()
	{
		// update the grid and send a request to the server.
		$("#jqxgrid").jqxGrid('updatebounddata', 'sort');
	},
	root: 'Asset',
}

Above code works well. I want to try the same thing by binding JSON data and I’m stuck. Any ideas?

var sourceFoo =
{
	datatype: "json",
	datafields: [
		{ name: 'label', type: 'string' },
		{ name: 'value', type: 'string' }
	],
        root: fooBar,
	url: 'foo.txt'
};

var adapterFoo = new $.jqx.dataAdapter(sourceFoo, {
	autoBind: true
});

var source =
{
	datatype: "json",
	datafields: [
		{ name: 'FooID', value: 'Foo', values: {source: adapterFoo.records, value: 'value', name: 'label'} },
		{ name: 'Foo', type: 'string'},
		{ name: 'Bar', type: 'string' },
		{ name: 'Taa', type: 'string' }
	],
	cache: false,
	url: './data/foobar.asp',
	filter: function()
	{
		// update the grid and send a request to the server.
		$("#jqxgrid").jqxGrid('updatebounddata', 'filter');
	},
	sort: function()
	{
		// update the grid and send a request to the server.
		$("#jqxgrid").jqxGrid('updatebounddata', 'sort');
	},
	root: 'fooBar'
}

[HristoParticipant]

Hello RedantJ,

If the data is like in first only need to set url: ‘…’ without to set root (if data structure is same).
And in the rows below (second source) has different root.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts