asp.net-mvc - jqGrid navGrid 按钮调用 ASP.NET MVC View - 如何？

Question

我正在使用:VS 2010、ASP.NET MVC2、jqGrid 3.8.2。

我想让 navGrid“编辑”按钮在 Controller 中打开不同的 View 。我尝试了很多方法都没有效果。为了打开所选行，我假设需要将 id 附加到 url。

jQuery('#listComponents').jqGrid({
    url: '/Components/Get',
    editurl: '/Components/Edit',
    ...
    }).navGrid('#pagerComponents', {edit:true, ...}, {url: '/Components/Edit'});

欢迎任何建议。如果我无法让它工作，我将在 jqGrid 外部添加一个“编辑”按钮，并执行正常的 Html.ActionLink 调用以打开不同的 View 。

谢谢!

更新

按照@Oleg的回答，我现在可以完美地完成以下工作:

    jQuery('#listComponents').jqGrid(
    {
        url: '/Components/Get/',
        ...
    }).navGrid('#pagerComponents', { edit: false, ...})
    .navButtonAdd('#pagerComponents', {
        caption: "",
        title: "Edit Component",
        buttonicon: "ui-icon-pencil",
        onClickButton: function () {
            var id = jQuery("#listComponents").getGridParam('selrow');
            if (id) {
                var data = jQuery("#listComponents").getRowData(id);
                window.location = '/Components/Edit/' + data.COMPONENTID;
            }
            else {
                alert("Please select a row to edit.");
            }
        }});

Answer 1

navGrid 的选项 {edit:true, ...}遵循 editGridRow 的用法表单编辑的方法，因此将显示对话框而不是 MVC Controller 的 View 。要获得您想要的行为，您应该使用 {edit:false, ...} 设置并添加 custom button它看起来和原来的“编辑”按钮一模一样。为此，您应该使用 buttonicon: "ui-icon-pencil" 参数(请参阅 navGrid source code 中的 editicon 默认参数)。在 this answer你会找到代码示例。您还可以使用 $.jgrid.nav.edittitle 作为标题参数:

var grid = $("#listComponents");
grid.jqGrid({
    url: '/Components/Get',
    editurl: '/Components/Edit',
    ...
});
grid.navGrid('#pagerComponents', {edit:false, ...}, ...);
grid.jqGrid ('navButtonAdd', '#pagerComponents',
    { caption: "", buttonicon: "ui-icon-pencil", title: $.jgrid.nav.edittitle,
      onClickButton: function() {
          var rowid = grid.jqGrid('getGridParam', 'selrow');
          window.location = '/Components/Edit/' + 'rowid';
      }
    }
);