jqGrid 4.13.6-pre - free jqGrid
我正在使用navGrid和内联编辑，并且无法格式化从服务器发回的验证消息。从内联编辑返回时，验证消息显示正常，但在从网格导航访问的添加/编辑表单中，它们看起来不太好。
我阅读了很多关于errorTextFormat事件的内容，它似乎正是我想要的，但我似乎无法弄清楚当从网格导航打开表单时如何访问它。我确信有一种简单的配置方法，但我无法弄明白。
$(function() {
var lastSel = 0;
$("#Grid")
.jqGrid({
url: '/url/to/griddata',
datatype: 'json',
mtype: 'POST',
colNames: ['Id', 'Name'],
colModel: [
{ name: 'Id', hidden: false, search: true, width: 150, align: 'center', sortable: true, editable: false, formatter: null, edittype: 'text' },
{ name: 'Name', hidden: false, search: true, width: 150, align: 'center', sortable: true, editable: true, formatter: null, edittype: 'text', editoptions: { maxlength: 256, value: null, required: true } }],
pager: '#GridPager',
prmNames: {
page: 'PageNumber',
rows: 'PageSize',
sort: 'SortColumn',
order: 'SortOrder',
search: 'Search',
nd: 'nd',
npage: 'null'
},
rowNum: 60,
rowList: [
15,
30,
60,
120
],
sortname: "Name",
sortorder: "asc",
viewrecords: true,
hidegrid: false,
gridview: true,
caption: '',
width: 980,
height: 100,
editurl: '/my/edit/url',
edit: {
errorTextFormat: function (data) {
alert('fired');
console.log(data);
return "error here";
}
},
jsonReader: {
total: 'TotalPages',
page: 'CurrentPage',
records: 'TotalRecords',
root: 'Rows',
id: 'Id',
repeatitems: false
},
onSelectRow: function(id) {
if (id && id !== lastSel) {
jQuery('#Grid').restoreRow(lastSel);
lastSel = id;
}
$('#Grid').jqGrid('editRow', id,
{
keys: true
});
}
});
$("#Grid").filterToolbar({ autosearch: true, searchOnEnter: false });
$("#Grid").navGrid('#GridPager', {
del: false, search: false, editerrorTextFormat: function (data) {
alert('fired');
console.log(data);
return "error here";
}
});
这是标记。
答案 0 :(得分：0)
jqGrid没有edit选项，editerrorTextFormat没有navGrid属性。通过使用formEditing选项可以轻松修复代码，该选项允许指定直接或间接在网格中使用的默认值editGridRow方法。您只需要将edit选项重命名为formEditing，您的代码就可以运行了。重要的只是服务器应该在报告错误时使用一些错误HTTP状态代码（例如400或更高）。在我看来，错误代码500或更高是我的最佳选择。
以同样的方式，您可以在免费jqGrid的filterToolbar选项中指定searching或搜索对话框的选项。您可以在jqGrid的navGrid选项中指定navOptions的默认选项。
我建议您另外使用jqGrid的savedRow参数而不是lastSel变量。在开始内联编辑或单元格编辑时，参数将由jqGrid填充。如果在修改之前包含可编辑值的数组，则另外包含id属性。因为你打算
我建议您另外使用pager: true代替pager: '#GridPager'，只需跳过'#GridPager'或navGrid的{{1}}参数即可。免费的jqGrid将自动为寻呼机生成inlineNav，它会为div分配唯一ID，并将<div>参数修改为pager: true。您的代码将更短，更易于阅读和维护。
最终代码可能如下所示
'#generatesIdValueOfTheDiv'（我在$(function() {
$("#Grid")
.jqGrid({
url: '/url/to/griddata',
datatype: 'json',
mtype: 'POST',
colModel: [
{ name: 'Id', align: 'center' },
{ name: 'Name', align: 'center', editable: true,
editoptions: { maxlength: 256, required: true } }
],
pager: true,
prmNames: {
page: 'PageNumber',
rows: 'PageSize',
sort: 'SortColumn',
order: 'SortOrder',
search: 'Search'
},
rowNum: 60,
rowList: [
15,
30,
60,
120
],
sortname: "Name",
viewrecords: true,
hidegrid: false,
width: 980,
height: 100,
editurl: '/my/edit/url',
jsonReader: {
total: 'TotalPages',
page: 'CurrentPage',
records: 'TotalRecords',
root: 'Rows',
id: 'Id',
repeatitems: false
},
formEditing: {
closeOnEscape: true,
closeAfterEdit: true,
savekey: [true, 13],
errorTextFormat: function (data) {
alert('fired');
console.log(data);
return "error here";
}
},
inlineEditing: {
keys: true
},
searching: {
searchOnEnter: false
},
navOptions: {
del: false,
search: false
},
onSelectRow: function (rowid) {
var $self = $(this), i,
// savedRows array is not empty if some row is in inline editing mode
savedRows = $self.jqGrid("getGridParam", "savedRow");
for (i = 0; i < savedRows.length; i++) {
if (savedRows[i].id !== rowid) {
// cancel editing of not saved rows
$self.jqGrid("restoreRow", savedRows[i].id);
}
}
$self.jqGrid("editRow", rowid);
}
})
.jqGrid("filterToolbar");
.jqGrid("navGrid");
});
中添加了一些常用的属性。您可以删除不需要的属性）。我删除了一些不需要的选项和formEditing的一些不需要的属性，因为您指定了默认值。