How to setup row actions in jqGrid
Using jquery's jqGrid plugin, I have it setup to do sorting, paging, and searching. Now what I need to do is add links in each row to redirect to different pages like edit for example based on that row's id (I don't want to use the jqGrid edit.) How wo开发者_开发技巧uld I create links within grid cells?
Was able to figure it out, note the gridComplete event:
jQuery(document).ready(function () {
jQuery("#list").jqGrid({
url: '/admin/campus/getnearbybusinesses',
datatype: "json",
colNames: ['Id', 'Name', 'Location', 'Verification', ''],
rowNum: 15,
/*rowList: [20, 40, 60],*/
pager: '#pager',
sortname: "Name",
sortorder: "asc",
viewrecords: true,
caption: "Businesses",
width: 930,
height: 470,
colModel: [
{ name: 'Id', hidden: true, sortable: false, search: false, width: 0 },
{ name: 'Name', index: 'Name', search: true, searchoptions: { sopt: ['cn']} },
{ name: 'Location', index: 'Location', search: false },
{ name: 'VerificationCode', index: 'VerificationCode', sortable: false, search: false, width: 40 },
{ name: 'action', index: 'action', sortable: false, search: false, width: 160 }
],
jsonReader: {
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: false,
cell: "cell",
id: "id",
userdata: 'rows'
},
gridComplete: function () {
var grid = jQuery("#list");
var ids = grid.jqGrid('getDataIDs');
for (var i = 0; i < ids.length; i++) {
var rowData = $("#list").getGridParam('userData')[ids[i] - 1];
var id = rowData.Id;
var viewButton = "<a href='/business/home/" + id + "/index' class='button'>View</a> ";
var upgradeDowngradeButton = "<a href='/admin/business/" + id + "/index' class='button'>Upgrade/Downgrade</a> ";
var deleteButton = "<a href='javascript:void(0)' onclick='doDelete(" + id + ")' class='button'>Delete</a>";
grid.jqGrid('setRowData', ids[i], { action: viewButton + upgradeDowngradeButton + deleteButton });
}
}
});
jQuery("#list").jqGrid('navGrid', '#pager', { edit: false, add: false, del: false });
});
精彩评论