我正在加载本地文件(我将csv文件解析为json,然后将数组传输到jqGrid)。通过jqGrid生成的表应该允许用户修改,添加和删除网格中的数据。在我想为网格添加一行之前,一切似乎都完美无缺。其中一列有参数key = true
,这是我的行ID。当我尝试添加新行时,网格会将我的ID更改为 jpg1 。其他列很好。以下是我使用的代码:
$("#jqGrid").jqGrid({
datatype: "local",
data: myData,
editurl: "clientArray",
colModel: [
{
label: 'Kod',
name: 'Kod',
width: 60,
editable: true,
key: true,
sorttype: 'number'
},
{
label: 'Firma',
name: 'Firma',
width: 120,
editoptions:
{
size: 40,
sopt:['cn']
},
editable: true,
sorttype: 'string'
},
{
label: 'Adres',
name: 'Adres',
width: 80,
editoptions: {size: 40},
editable: true
},
{
label: 'Miasto',
name: 'Miasto',
width: 80,
editoptions:
{
size: 40,
sopt:['cn']
},
editable: true
}
],
height: 'auto',
autowidth: true,
shrinkToFit: false,
forceFit: false,
autoencode: true,
viewrecords: true,
caption: "Title",
pager: "#jqGridPager",
sortable: true,
ignoreCase: true,
sortname: 'Kod',
sortorder: 'asc',
rowNum: 5,
rowList: [5, 10, 20, "10000:All"],
ondblClickRow: function(rowid) {
$("#jqGrid").jqGrid('editGridRow', rowid,
{
editCaption: "The Edit Dialog",
zIndex:100,
recreateForm: true,
closeAfterEdit: true,
width: 900,
errorTextFormat: function (data) {
return 'Error: ' + data.responseText
}
});
}
});
$('#jqGrid').jqGrid('navGrid',"#jqGridPager",
{ edit: true, add: true, del: true, search: false, refresh: true, view: true, cloneToTop: true},
// options for the Edit Dialog
{
editCaption: "The Edit Dialog",
zIndex:100,
recreateForm: true,
closeAfterEdit: true,
reloadAfterSubmit: true,
width: 900,
errorTextFormat: function (data) {
return 'Error: ' + data.responseText
}
},
// options for the Add Dialog
{
width: 900,
zIndex:100,
closeAfterAdd: true,
recreateForm: true,
reloadAfterSubmit: true,
errorTextFormat: function (data) {
return 'Error: ' + data.responseText
}
},
// options for the Delete Dialog
delSettings,
// options for the Search Dialog
{
zIndex:100
},
// options for the View Dialog
{
width: '100%'
});
我附上了显示问题的屏幕截图: Photo 我使用的数据是通过Papaparse.js插件解析为JSON数组的文件。
修改 如果有人想测试代码,我已经添加了测试数据。
var myData = [];
myData.push(
{
Kod: 1.1,
Firma: 'Hutchinson',
Adres: '5th Avenue',
Miasto: 'Wroclaw'
},
{
Kod: 2.1,
Firma: 'BMW',
Adres: '6th Avenue',
Miasto: 'Warsaw'
});
我将不胜感激任何帮助。
答案 0 :(得分:1)
如果您只需要网格进行本地编辑,您可以考虑删除key: true
属性来解决问题。这是方式,我建议你。您可以在输入数据中包含id
属性,该属性将用作rowid(id
个<tr>
元素的值)的值。
或者,您可以更改“添加对话框”的块&#34;选项。以下
// options for the Add Dialog
{
width: 900,
zIndex:100,
closeAfterAdd: true,
recreateForm: true,
reloadAfterSubmit: true,
onclickSubmit: function (options, postdata, frmoper) {
// save Kod in some other parameter
return {myKod: postdata.Kod};
},
afterSubmit: function (jqXHR,postdata, frmoper) {
// restore the correct value
postdata.Kod = postdata.myKod;
// inform jqGrid that it was not an error
return [true];
}
},
你仍然无法改变行中id
的行。
顺便说一句,你写的是使用jqGrid 4.7.1。我想提醒你,jqGrid 4.7.0是免费的最后一个版本。这就是为什么我开始免费的jqGrid项目的原因。你可以得到here(见readme和wiki)。
The demo显示了使用免费jqGrid 4.8的上述代码修复示例。