JqGrid添加数据行中添加按钮

jqGrid操作栏动态生成

最新推荐文章于 2023-07-07 11:04:38 发布

转载最新推荐文章于 2023-07-07 11:04:38 发布 · 762 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/hexinxiaoyao/archive/2012/09/07/2674678.html

文章标签：

#javascript #ViewUI

本文详细介绍如何使用jqGrid插件动态生成操作栏，包括编辑和删除按钮，并通过gridComplete事件进行绑定。此方法适用于需要在表格中动态展示操作选项的场景。

colNames: ['NewRequestId', 'Applicant', 'Applicant Department'，'Edit', 'Delete'],
colModel: [
{ name: 'NewRequestId', index: 'NewRequestId', hidden: true, sortable: false, align: "center", width: "1px" },
{ name: 'ApplicatUserName', index: 'ApplicatUserName', sortable: false, align: "center", width: "120px" },
{ name: 'ApplicatDepartment', index: 'ApplicatDepartment', sortable: false, align: "center", width: "140px" },
{ name: 'Edit', index: 'Edit', sortable: false, align: "center", width: "100px" },

{ name: 'Delete', index: 'Delete', sortable: false, align: "center", width: "100px" }

在gridComplete事件中添加：

gridComplete: function () {
var ids = jQuery("#RequestList").jqGrid('getDataIDs');
for (var i = 0; i < ids.length; i++) {
var id = ids[i];
var DeleteBtn = "<a href='#' style='color:#f60' onclick='OpenAllocationDialog()' >Abolish</a>";
var editBtn = "<a href='#' style='color:#f60' onclick='OpenAllocationDialog()' >Edit</a>";
jQuery("#RequestList").jqGrid('setRowData', ids[i], { Edit: editBtn, Delete: DeleteBtn });
}

转载于:https://www.cnblogs.com/hexinxiaoyao/archive/2012/09/07/2674678.html