jQGrid - " jpg1"而不是正确的身份证号码

时间:2015-03-27 10:39:04

标签: javascript jquery jqgrid local

我正在加载本地文件(我将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'
  });

我将不胜感激任何帮助。

1 个答案:

答案 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(见readmewiki)。

The demo显示了使用免费jqGrid 4.8的上述代码修复示例。