代码之家 › 专栏 › 技术社区 › ulu

在ASP.NET MVC中将命令列添加到JQgrid

jqgrid-asp.net command jqgrid asp.net-mvc

ulu · 技术社区 · 14 年前

我希望你早上好。

我想在我的ASP.NET应用程序中使用jqgrid。到目前为止,我一直在生成一个HTML表并将其转换为网格,但我想尝试一种更好的方法:通过Ajax调用加载数据,就像网格中的数据一样。我知道了如何获取数据,但是除了数据列之外,我还希望有“编辑”和“删除”列。我如何实现它?

我不想为我的控制器中的按钮设计HTML。理想的解决方案是只发送数据,让jqgrid根据一些客户端模板和id值添加所需的列。我不能手动执行,因为我不能向现有网格添加列。那么,我该怎么办?

更新 . 我不需要仅仅实现编辑/删除功能。我需要的是添加一个基于模板和“id”值的HTML列,比如 <a href="MoreDetails/{id}">[More details]</a>

2 回复 | 直到 14 年前

Community pid 7 年前

如果使用jqgrid,从服务器发送纯数据是正确的方法。

要像您希望的那样实现行编辑,请查看 jqGrid Demo 在左侧选择“行编辑”,然后选择“自定义编辑”。我个人更喜欢用这个名字” inline editing (在“行编辑”下的同一演示中选择“输入类型”)。通过双击而不是选择行来实现编辑模式下的切换(请参见 jqGrid - edit only certain rows for an editable column 例如)。要删除行,您可以使用 form editing “。要使用它,您应该添加 Navigator 对于navgrid方法,使用相应的参数选择工具栏中您需要的按钮。要在演示中看到这一点,请选择“实时数据操作”,然后选择“导航器”。

更新 :在 jqgrid演示 ,请参阅“行编辑”,然后参阅“自定义编辑”,您可以了解如何使用 setRowData 的内部 gridComplete 或 loadComplete 要设置的句柄任何 HTML代码片段。你为什么不喜欢这个方法?您也可以使用 predefined showlink formatter 显示链接或使用 custom formatter 和 custom unformatter 显示 任何HTML包含 在jqgrid单元中。

boca 14 年前

你现在可能已经知道了,但是这里值得一提的是我使用自定义格式化程序的答案。使用自定义格式化程序呈现操作列,该格式化程序显示调用简单javascript函数的按钮。

$(document).ready(function () {
        $("#all-errors-list").jqGrid({
            url: '/Error/AllErrors/',
            datatype: 'json',
            mtype: 'GET',
            colNames: ['Id', 'Error','Actions'],
            colModel: [
            { name: 'Id', index: 'Id', width: 100, align: 'left', editable: true},
            { name: 'ErrorDetails', index: 'ErrorDetails', width: 350, align: 'left' },
            { name: 'ActionId', width:400, formatter: actionFormatter}
                      ],
            pager: '#all-errors-pager',
            rowNum: 10,
            rowList: [10, 20, 50],
            sortname: 'Id',
            sortorder: 'asc',
            viewrecords: true,
            imgpath: '<%=Html.ImagePath()%>',
            caption: 'Open Errors',
            height: "100%",
            width: "100%",
            gridComplete: function () { $("button").button(); }
        })

    function actionFormatter(cellvalue, options, rowObject) {
        return "<button onclick=\"alert('" + cellvalue + "')\">Details</button>" ;
    }

希望有帮助。