0
因此,我使用JQGrid生成表。数据从数据库中读取,表格通过JSON填充。一旦表格被渲染,所有的排序和编辑都在本地完成,直到数据被保存到数据库中。我正在使用sortableRows函数,以便我可以拖放和重新排序行;它正在按预期工作,除了我还希望根据新订单来更改特定列的值。我一直在关注这个例子here,正如我正在做的那样,但是看着源代码并没有给我带来太多的好处。我相信它与update()
函数有关。JQGrid sortableRows更改排序列值以匹配新订单
我希望显示顺序列的值从0开始重新编号,依次取决于行的新顺序。就像在我的例子
任何人都可以给我一些正确的方向的见解吗?
这里是我的jqGrid代码:
$(function() {
$("#grid").jqGrid({
url:'/WEB_META_CONFIG/meta/record?meta_type=${meta_type}&plan_id=${plan_id}',
datatype: 'json',
mtype: 'GET',
colNames:[
'Display Order',
'Field Name',
'Field Label',
'Meta Type',
'Display Control',
'plan id',
'lov',
'rounding formula',
'units',
'hrms data type',
'conversion data type',
'modified by',
'capability',
'field width',
'field validation message',
'field null string',
'field ineligibility tag',
'hard validation logic',
'hard validation message',
'soft validation logic',
'soft validation message',
'attribute1',
'attribute2',
'attribute3',
'attribute4',
'attribute5',
'field required',
'field length',
'field format',
//'calculation',
],
colModel:[
{name:'display_order',index:'display_order', align:'center', width:'100',sorttype:'int'},
{name:'field_name',index:'field_name', align:'left', editable:true},
{name:'field_label',index:'field_label', align:'left', editable:true},
{name:'meta_type',index:'meta_type', align:'center', width:'60'},
{name:'display_control',index:'display_control', align:'left',editable:true},
{name:'plan_id',index:'plan_id', align:'left',hidden:true},
{name:'lov', index:'lov', align:'left',hidden:true},
{name:'rounding_formula', index:'rounding_formula', align:'left',hidden:true},
{name:'units', index:'units', align:'left',hidden:true},
{name:'hrms_data_type', index:'hrms_data_type', align:'left',hidden:true},
{name:'conversion_data_type', index:'conversion_data_type', align:'left',hidden:true},
{name:'modified_by', index:'modified_by', align:'left',hidden:true},
{name:'capability', index:'capability', align:'left',hidden:true},
{name:'field_width', index:'field_width', align:'left',hidden:true},
{name:'field_validation_message', index:'field_validation_message', align:'left',hidden:true},
{name:'field_null_string', index:'field_null_string', align:'left',hidden:true},
{name:'field_ineligibility_tag', index:'field_ineligibility_tag', align:'left',hidden:true},
{name:'hard_validation_logic', index:'hard_validation_logic', align:'left',hidden:true},
{name:'hard_validation_message', index:'hard_validation_message', align:'left',hidden:true},
{name:'soft_validation_logic', index:'soft_validation_logic', align:'left',hidden:true},
{name:'soft_validation_message', index:'soft_validation_message', align:'left',hidden:true},
{name:'attribute1', index:'attribute1', align:'left',hidden:true},
{name:'attribute2', index:'attribute2', align:'left',hidden:true},
{name:'attribute3', index:'attribute3', align:'left',hidden:true},
{name:'attribute4', index:'attribute4', align:'left',hidden:true},
{name:'attribute5', index:'attribute5', align:'left',hidden:true},
{name:'field_required', index:'field_required', align:'left',hidden:true},
{name:'field_length', index:'field_length', align:'left',hidden:true},
{name:'field_format', index:'field_format', align:'left',hidden:true},
//{name:'calculation', index:'calculation', align:'left',hidden:true},
],
rowNum:10,
rowList:[10,20,40],
shrinkToFit : true,
loadonce: true,
gridview: true,
//editurl:'/WEB_META_CONFIG/meta/record',
cellEdit: true,
cellsubmit:'clientArray',
height: 'auto',
autowidth: true,
rownumbers: false,
pager: '#pager',
sortname: 'display_order',
viewrecords: true,
sortorder: "asc",
caption:"${plan_id} - ${meta_type}",
emptyrecords: "Empty records",
sortable:true,
jsonReader : {
repeatitems: false,
},
beforeSelectRow : function(rowid) {return false;},
ondblClickRow: function(rowid, iRow,iCol){
$('#grid').editCell(iRow, iCol, true);
},
});
$("#grid").jqGrid('navGrid','#pager',{edit:false,add:false,del:false,search:false});
$('#grid').jqGrid('sortableRows', {
update:function(ev, ui){
var item = ui.item[0], ri = item.rowIndex, itemId = item.id;
}
});
$("#grid").navButtonAdd('#pager',
{ caption:"Save",
buttonicon:"ui-icon-disk",
onClickButton: save,
position: "last",
title:"",
cursor: "pointer"
}
);
function save(){
//var data = $('#grid').jqGrid('getRowData');
var data = $('#grid').jqGrid('getGridParam', 'data');
for(var i = 0; i < data.length; i++){
delete data[i]["_id_"];
}
$.ajax({
type :"POST",
url : "/WEB_META_CONFIG/meta/record/save",
contentType: "application/json; charset=utf-8",
dataType:"json",
data: JSON.stringify(data, function(key, value){
return (value == null) ? "" : value;
}
),
success: function(){
alert('Save Successfully');
}
});
}
});