如何更改 jqgrid 中的行位置?
How to Change Row Location in jqgrid?
我正在将 jqgrid 与 MVC 一起使用,现在,我想在单击 ^ 时更改行位置以获取一行并反转。
实际上我想为每一行设置 'up' 和 'down' 标志以更改一级行位置
任何人都可以帮助我吗?!
有很多可能的解决方案。其中之一是使用自定义 formtter 来定义按钮,然后在 loadComplete 上绑定事件以使用 jquery 移动行。代码下方:
$("#jqGrid").jqGrid({
datatype: "local",
data: mydata,
height: 250,
width: 780,
colModel: [
{ label :'move', formatter : myformatter, width:95},
{ label: 'Inv No', name: 'id', width: 75, key:true },
{ label: 'Date', name: 'invdate', width: 90 },
{ label: 'Client', name: 'name', width: 100 },
{ label: 'Amount', name: 'amount', width: 80 },
{ label: 'Tax', name: 'tax', width: 80 },
{ label: 'Total', name: 'total', width: 80 },
{ label: 'Notes', name: 'note', width: 150 }
],
viewrecords: true, // show the current page, data rang and total records on the toolbar
caption: "Load jqGrid through Javascript Array",
loadComplete : function() {
$(".up,.down").on('click', function () {
var row = $(this).closest("tr.jqgrow");
if($(this).is('.up')){
row.insertBefore(row.prev());
} else {
row.insertAfter(row.next());
}
});
}
});
function myformatter() {
return '<button class="up" >Up</button>' + '<button class="down">Down</button>';
}
演示 here
我正在将 jqgrid 与 MVC 一起使用,现在,我想在单击 ^ 时更改行位置以获取一行并反转。
实际上我想为每一行设置 'up' 和 'down' 标志以更改一级行位置
任何人都可以帮助我吗?!
有很多可能的解决方案。其中之一是使用自定义 formtter 来定义按钮,然后在 loadComplete 上绑定事件以使用 jquery 移动行。代码下方:
$("#jqGrid").jqGrid({
datatype: "local",
data: mydata,
height: 250,
width: 780,
colModel: [
{ label :'move', formatter : myformatter, width:95},
{ label: 'Inv No', name: 'id', width: 75, key:true },
{ label: 'Date', name: 'invdate', width: 90 },
{ label: 'Client', name: 'name', width: 100 },
{ label: 'Amount', name: 'amount', width: 80 },
{ label: 'Tax', name: 'tax', width: 80 },
{ label: 'Total', name: 'total', width: 80 },
{ label: 'Notes', name: 'note', width: 150 }
],
viewrecords: true, // show the current page, data rang and total records on the toolbar
caption: "Load jqGrid through Javascript Array",
loadComplete : function() {
$(".up,.down").on('click', function () {
var row = $(this).closest("tr.jqgrow");
if($(this).is('.up')){
row.insertBefore(row.prev());
} else {
row.insertAfter(row.next());
}
});
}
});
function myformatter() {
return '<button class="up" >Up</button>' + '<button class="down">Down</button>';
}
演示 here