jqwidgets 无法从 JSON 加载数据
jqwidgets fails to load data from JSON
我正在尝试从 JSON 响应加载 jqwidgets 网格。
网格加载空数据,没有任何错误。
下面是 Json 响应和 jquery 代码。请告诉我我在这里错过了什么吗?
JSON 数据:
{"holidayrule":["{\"hid\":\"263\",\"hdates\":\"06/21/2015, 06/22/2015, 06/23/2015, 06/24/2015, 06/25/2015, 06/26/2015, 06/27/2015, 06/28/2015, 06/29/2015, 06/30/2015, 07/01/2015, 07/02/2015\",\"hremark\":\"MyRuleRemark\",\"created_date\":\"2015-02-10 09:59:57.44\",\"updated_date\":\"2015-02-10 09:59:57.44\",\"hname\":\"MyRuleName\"}","{\"hid\":\"264\",\"hdates\":\"05/08/2015, 05/09/2015, 05/10/2015, 05/11/2015, 05/12/2015, 05/13/2015, 05/14/2015, 05/15/2015, 05/16/2015, 05/17/2015, 05/18/2015, 05/19/2015\",\"hremark\":\"ggfgf\",\"created_date\":\"2015-02-10 11:08:52.489\",\"updated_date\":\"2015-02-10 11:08:52.489\",\"hname\":\"gfd\"}","{\"hid\":\"265\",\"hdates\":\"01/23/2015, 01/24/2015, 01/25/2015, 01/26/2015, 01/27/2015, 01/28/2015, 01/29/2015, 01/30/2015, 01/31/2015, 02/01/2015, 02/02/2015, 02/03/2015\",\"hremark\":\"ghhghhghhg\",\"created_date\":\"2015-02-10 15:22:11.69\",\"updated_date\":\"2015-02-10 15:22:11.69\",\"hname\":\"fggg\"}","{\"hid\":\"266\",\"hdates\":\"02/25/2015, 02/26/2015, 02/27/2015, 02/28/2015, 03/01/2015, 03/02/2015, 03/03/2015, 03/04/2015, 03/05/2015, 03/06/2015, 03/07/2015, 03/08/2015\",\"hremark\":\"df\",\"created_date\":\"2015-02-10 15:22:26.133\",\"updated_date\":\"2015-02-10 15:22:26.133\",\"hname\":\"gfggf\"}","{\"hid\":\"267\",\"hdates\":\"01/07/2015, 01/08/2015, 01/09/2015, 01/10/2015, 01/11/2015, 01/12/2015, 01/13/2015, 01/14/2015, 01/15/2015, 01/16/2015, 01/17/2015, 01/18/2015\",\"hremark\":\"hghhghgh\",\"created_date\":\"2015-02-10 15:41:22.527\",\"updated_date\":\"2015-02-10 15:41:22.527\",\"hname\":\"33232\"}","{\"hid\":\"268\",\"hdates\":\"01/15/2015, 01/16/2015, 01/17/2015, 01/18/2015, 01/19/2015, 01/20/2015, 01/21/2015, 01/22/2015, 01/23/2015, 01/24/2015, 01/25/2015, 01/26/2015\",\"hremark\":\"dfdfdfdfd\",\"created_date\":\"2015-02-10 16:23:37.855\",\"updated_date\":\"2015-02-10 16:23:37.855\",\"hname\":\"sdffddf\"}"]}
JQUERY :
var parsedData = JSON.stringify(data.holidayrule);
var source =
{
localdata: parsedData,
datatype: "json"
}
var dataAdapter = new $.jqx.dataAdapter(source);
// initialize divHolidayruleData
$("#divHolidayruleData").jqxGrid(
{
width: 850,
source: dataAdapter,
pageable: true,
autoheight: true,
sortable: true,
altrows: true,
columns: [
{ text: 'HID', datafield: 'hid', align: 'center', cellsalign: 'center', width: 70 },
{ text: 'Rule Name', datafield: 'hname', cellsalign: 'center', align: 'center', width: 200 },
{ text: 'Holiday Dates', datafield: 'hdates', align: 'center', cellsalign: 'center', width: 200 },
{ text: 'Remark', datafield: 'hremark', align: 'center', cellsalign: 'center', width: 150 },
{ text: 'Created Date', datafield: 'created_date', align: 'center', cellsalign: 'center', width: 100 },
{ text: 'Updated Date', datafield: 'updated_date', align: 'center', cellsalign: 'center', width: 130 }
]
});
我是不是遗漏了什么?
编辑:
["{\"hid\":263,\"hdates\":\"06/21/2015, 06/22/2015, 06/23/2015, 06/24/2015, 06/25/2015, 06/26/2015, 06/27/2015, 06/28/2015, 06/29/2015, 06/30/2015, 07/01/2015, 07/02/2015\",\"hremark\":\"MyRuleRemark\",\"created_date\":\"2015-02-10 09:59:57.44\",\"updated_date\":\"2015-02-10 09:59:57.44\",\"hname\":\"MyRuleName\"}","{\"hid\":264,\"hdates\":\"05/08/2015, 05/09/2015, 05/10/2015, 05/11/2015, 05/12/2015, 05/13/2015, 05/14/2015, 05/15/2015, 05/16/2015, 05/17/2015, 05/18/2015, 05/19/2015\",\"hremark\":\"ggfgf\",\"created_date\":\"2015-02-10 11:08:52.489\",\"updated_date\":\"2015-02-10 11:08:52.489\",\"hname\":\"gfd\"}","{\"hid\":265,\"hdates\":\"01/23/2015, 01/24/2015, 01/25/2015, 01/26/2015, 01/27/2015, 01/28/2015, 01/29/2015, 01/30/2015, 01/31/2015, 02/01/2015, 02/02/2015, 02/03/2015\",\"hremark\":\"ghhghhghhg\",\"created_date\":\"2015-02-10 15:22:11.69\",\"updated_date\":\"2015-02-10 15:22:11.69\",\"hname\":\"fggg\"}","{\"hid\":266,\"hdates\":\"02/25/2015, 02/26/2015, 02/27/2015, 02/28/2015, 03/01/2015, 03/02/2015, 03/03/2015, 03/04/2015, 03/05/2015, 03/06/2015, 03/07/2015, 03/08/2015\",\"hremark\":\"df\",\"created_date\":\"2015-02-10 15:22:26.133\",\"updated_date\":\"2015-02-10 15:22:26.133\",\"hname\":\"gfggf\"}","{\"hid\":267,\"hdates\":\"01/07/2015, 01/08/2015, 01/09/2015, 01/10/2015, 01/11/2015, 01/12/2015, 01/13/2015, 01/14/2015, 01/15/2015, 01/16/2015, 01/17/2015, 01/18/2015\",\"hremark\":\"hghhghgh\",\"created_date\":\"2015-02-10 15:41:22.527\",\"updated_date\":\"2015-02-10 15:41:22.527\",\"hname\":\"33232\"}","{\"hid\":268,\"hdates\":\"01/15/2015, 01/16/2015, 01/17/2015, 01/18/2015, 01/19/2015, 01/20/2015, 01/21/2015, 01/22/2015, 01/23/2015, 01/24/2015, 01/25/2015, 01/26/2015\",\"hremark\":\"dfdfdfdfd\",\"created_date\":\"2015-02-10 16:23:37.855\",\"updated_date\":\"2015-02-10 16:23:37.855\",\"hname\":\"sdffddf\"}"]
与上述相同的问题JSON
编辑 2:
您错过了通过 Data Apdater 进行数据绑定中最基本的概念之一 - 数据字段数组在您的代码中未定义。每个数据字段应该有 "name" 和 "type"。您的数据也在 "holidayrule" 内,这意味着您还必须设置源对象的 "root" 属性。
已更新:
var data = "[" +
"{\"hid\":263,\"hdates\":\"06/21/2015, 06/22/2015, 06/23/2015, 06/24/2015, 06 /25/2015, 06/26/2015, 06/27/2015, 06/28/2015, 06/29/2015, 06/30/2015, 07/01/2015, 07/02/2015\",\ "hremark\":\"MyRuleRemark\":\"created_date\":\"2015-02-10 09:59:57.44\",\"updated_date\":\"2015-02- 10 09:59:57.44\",\"hname\":\"MyRuleName\"}"
+ "]";
变种来源= {
本地数据:数据,
数据字段:[{ 名称:'hname',类型:'string' }],
数据类型:"json"
};
var dataAdapter = new $.jqx.dataAdapter(source);
$("#jqxgridTest").jqxGrid({
width: 670,
source: dataAdapter,
altrows: true,
selectionmode: 'multiplecellsextended',
columns: [{
text: 'HID',
datafield: 'hid',
width: 70
}, {
text: 'Rule Name',
datafield: 'hname',
width: 70
}, {
text: 'Holiday Dates',
datafield: 'hdates',
width: 70
}, {
text: 'Remark',
datafield: 'hremark',
width: 70
}, {
text: 'Created Date',
datafield: 'created_date',
width: 70
}, {
text: 'Updated Date',
datafield: 'updated_date',
width: 70
}]
});
});
我正在尝试从 JSON 响应加载 jqwidgets 网格。 网格加载空数据,没有任何错误。 下面是 Json 响应和 jquery 代码。请告诉我我在这里错过了什么吗?
JSON 数据:
{"holidayrule":["{\"hid\":\"263\",\"hdates\":\"06/21/2015, 06/22/2015, 06/23/2015, 06/24/2015, 06/25/2015, 06/26/2015, 06/27/2015, 06/28/2015, 06/29/2015, 06/30/2015, 07/01/2015, 07/02/2015\",\"hremark\":\"MyRuleRemark\",\"created_date\":\"2015-02-10 09:59:57.44\",\"updated_date\":\"2015-02-10 09:59:57.44\",\"hname\":\"MyRuleName\"}","{\"hid\":\"264\",\"hdates\":\"05/08/2015, 05/09/2015, 05/10/2015, 05/11/2015, 05/12/2015, 05/13/2015, 05/14/2015, 05/15/2015, 05/16/2015, 05/17/2015, 05/18/2015, 05/19/2015\",\"hremark\":\"ggfgf\",\"created_date\":\"2015-02-10 11:08:52.489\",\"updated_date\":\"2015-02-10 11:08:52.489\",\"hname\":\"gfd\"}","{\"hid\":\"265\",\"hdates\":\"01/23/2015, 01/24/2015, 01/25/2015, 01/26/2015, 01/27/2015, 01/28/2015, 01/29/2015, 01/30/2015, 01/31/2015, 02/01/2015, 02/02/2015, 02/03/2015\",\"hremark\":\"ghhghhghhg\",\"created_date\":\"2015-02-10 15:22:11.69\",\"updated_date\":\"2015-02-10 15:22:11.69\",\"hname\":\"fggg\"}","{\"hid\":\"266\",\"hdates\":\"02/25/2015, 02/26/2015, 02/27/2015, 02/28/2015, 03/01/2015, 03/02/2015, 03/03/2015, 03/04/2015, 03/05/2015, 03/06/2015, 03/07/2015, 03/08/2015\",\"hremark\":\"df\",\"created_date\":\"2015-02-10 15:22:26.133\",\"updated_date\":\"2015-02-10 15:22:26.133\",\"hname\":\"gfggf\"}","{\"hid\":\"267\",\"hdates\":\"01/07/2015, 01/08/2015, 01/09/2015, 01/10/2015, 01/11/2015, 01/12/2015, 01/13/2015, 01/14/2015, 01/15/2015, 01/16/2015, 01/17/2015, 01/18/2015\",\"hremark\":\"hghhghgh\",\"created_date\":\"2015-02-10 15:41:22.527\",\"updated_date\":\"2015-02-10 15:41:22.527\",\"hname\":\"33232\"}","{\"hid\":\"268\",\"hdates\":\"01/15/2015, 01/16/2015, 01/17/2015, 01/18/2015, 01/19/2015, 01/20/2015, 01/21/2015, 01/22/2015, 01/23/2015, 01/24/2015, 01/25/2015, 01/26/2015\",\"hremark\":\"dfdfdfdfd\",\"created_date\":\"2015-02-10 16:23:37.855\",\"updated_date\":\"2015-02-10 16:23:37.855\",\"hname\":\"sdffddf\"}"]}
JQUERY :
var parsedData = JSON.stringify(data.holidayrule);
var source =
{
localdata: parsedData,
datatype: "json"
}
var dataAdapter = new $.jqx.dataAdapter(source);
// initialize divHolidayruleData
$("#divHolidayruleData").jqxGrid(
{
width: 850,
source: dataAdapter,
pageable: true,
autoheight: true,
sortable: true,
altrows: true,
columns: [
{ text: 'HID', datafield: 'hid', align: 'center', cellsalign: 'center', width: 70 },
{ text: 'Rule Name', datafield: 'hname', cellsalign: 'center', align: 'center', width: 200 },
{ text: 'Holiday Dates', datafield: 'hdates', align: 'center', cellsalign: 'center', width: 200 },
{ text: 'Remark', datafield: 'hremark', align: 'center', cellsalign: 'center', width: 150 },
{ text: 'Created Date', datafield: 'created_date', align: 'center', cellsalign: 'center', width: 100 },
{ text: 'Updated Date', datafield: 'updated_date', align: 'center', cellsalign: 'center', width: 130 }
]
});
我是不是遗漏了什么?
编辑:
["{\"hid\":263,\"hdates\":\"06/21/2015, 06/22/2015, 06/23/2015, 06/24/2015, 06/25/2015, 06/26/2015, 06/27/2015, 06/28/2015, 06/29/2015, 06/30/2015, 07/01/2015, 07/02/2015\",\"hremark\":\"MyRuleRemark\",\"created_date\":\"2015-02-10 09:59:57.44\",\"updated_date\":\"2015-02-10 09:59:57.44\",\"hname\":\"MyRuleName\"}","{\"hid\":264,\"hdates\":\"05/08/2015, 05/09/2015, 05/10/2015, 05/11/2015, 05/12/2015, 05/13/2015, 05/14/2015, 05/15/2015, 05/16/2015, 05/17/2015, 05/18/2015, 05/19/2015\",\"hremark\":\"ggfgf\",\"created_date\":\"2015-02-10 11:08:52.489\",\"updated_date\":\"2015-02-10 11:08:52.489\",\"hname\":\"gfd\"}","{\"hid\":265,\"hdates\":\"01/23/2015, 01/24/2015, 01/25/2015, 01/26/2015, 01/27/2015, 01/28/2015, 01/29/2015, 01/30/2015, 01/31/2015, 02/01/2015, 02/02/2015, 02/03/2015\",\"hremark\":\"ghhghhghhg\",\"created_date\":\"2015-02-10 15:22:11.69\",\"updated_date\":\"2015-02-10 15:22:11.69\",\"hname\":\"fggg\"}","{\"hid\":266,\"hdates\":\"02/25/2015, 02/26/2015, 02/27/2015, 02/28/2015, 03/01/2015, 03/02/2015, 03/03/2015, 03/04/2015, 03/05/2015, 03/06/2015, 03/07/2015, 03/08/2015\",\"hremark\":\"df\",\"created_date\":\"2015-02-10 15:22:26.133\",\"updated_date\":\"2015-02-10 15:22:26.133\",\"hname\":\"gfggf\"}","{\"hid\":267,\"hdates\":\"01/07/2015, 01/08/2015, 01/09/2015, 01/10/2015, 01/11/2015, 01/12/2015, 01/13/2015, 01/14/2015, 01/15/2015, 01/16/2015, 01/17/2015, 01/18/2015\",\"hremark\":\"hghhghgh\",\"created_date\":\"2015-02-10 15:41:22.527\",\"updated_date\":\"2015-02-10 15:41:22.527\",\"hname\":\"33232\"}","{\"hid\":268,\"hdates\":\"01/15/2015, 01/16/2015, 01/17/2015, 01/18/2015, 01/19/2015, 01/20/2015, 01/21/2015, 01/22/2015, 01/23/2015, 01/24/2015, 01/25/2015, 01/26/2015\",\"hremark\":\"dfdfdfdfd\",\"created_date\":\"2015-02-10 16:23:37.855\",\"updated_date\":\"2015-02-10 16:23:37.855\",\"hname\":\"sdffddf\"}"]
与上述相同的问题JSON
编辑 2:
您错过了通过 Data Apdater 进行数据绑定中最基本的概念之一 - 数据字段数组在您的代码中未定义。每个数据字段应该有 "name" 和 "type"。您的数据也在 "holidayrule" 内,这意味着您还必须设置源对象的 "root" 属性。
已更新:
var data = "[" +
"{\"hid\":263,\"hdates\":\"06/21/2015, 06/22/2015, 06/23/2015, 06/24/2015, 06 /25/2015, 06/26/2015, 06/27/2015, 06/28/2015, 06/29/2015, 06/30/2015, 07/01/2015, 07/02/2015\",\ "hremark\":\"MyRuleRemark\":\"created_date\":\"2015-02-10 09:59:57.44\",\"updated_date\":\"2015-02- 10 09:59:57.44\",\"hname\":\"MyRuleName\"}" + "]"; 变种来源= { 本地数据:数据, 数据字段:[{ 名称:'hname',类型:'string' }], 数据类型:"json" };
var dataAdapter = new $.jqx.dataAdapter(source);
$("#jqxgridTest").jqxGrid({
width: 670,
source: dataAdapter,
altrows: true,
selectionmode: 'multiplecellsextended',
columns: [{
text: 'HID',
datafield: 'hid',
width: 70
}, {
text: 'Rule Name',
datafield: 'hname',
width: 70
}, {
text: 'Holiday Dates',
datafield: 'hdates',
width: 70
}, {
text: 'Remark',
datafield: 'hremark',
width: 70
}, {
text: 'Created Date',
datafield: 'created_date',
width: 70
}, {
text: 'Updated Date',
datafield: 'updated_date',
width: 70
}]
});
});