jquery - 在 ASP.NET MVC 中呈现 jQuery jqGrid 插件后，我可以更改其双击事件处理程序 (ondblClickRow) 吗？

Question

我一直在成功使用jqGrid；然而，我遇到了一些我似乎无法工作的事情。我通过 AJAX 将网格定义作为 PartialViewResult 返回，并将结果附加到 div。

然后我想更改所述网格的双击事件。我正在使用 Firebug，似乎可以使用 $('#my-grid')[0] 访问网格元素，但是当我尝试像下面这样调用它的方法时，它告诉我 jqGrid 是“没有定义的”。

我很确定我已经正确引用了 jqGrid 内容，否则我不会走到这一步(我已经在网格中显示和编辑数据了)。以下是获取并尝试修改网格定义的代码:

    $(document).ready(function() {

        //Add the grid by pulling it via AJAX
        $.get('<%=Url.Action("Grid","Entity", new {id = "CustomerAccount"}) %>', function(htmlResult) {

            //Append grid definition to div
            $('#customer-list').append(htmlResult);
            var myGrid = $($('#CustomerAccount-grid')[0]);
            $(myGrid).jqGrid('setGridParam', { ondblClickRow: function(rowid, iRow, iCol, e) { console.log('dblclicked'); } })
                .trigger('reloadGrid');
            //NOTE: I've tried with and without the reloadGrid
}

更新:我想我现在已经得出结论，我确信我将元素引用为 jQuery 对象，存在计时问题。下面网格定义的简化负载说明了这个问题:

//Append grid definition to div
$('#customer-list').load('<%=Url.Action("Grid","Entity", new {id = "CustomerAccount"}) %>',function() {

    console.log('sortname=' + $($('#CustomerAccount-grid:first')).jqGrid('getGridParam', 'sortname'));
  });

此日志排序名称=未定义；但是，如果我将同一行复制并粘贴到 Firebug 中，它会显示 sortname=Name，这是正确的。

最终更新:我的问题的很大一部分可能是我没有将元素作为 jQuery 对象获取，所以我将解决方案归功于drachenstern(谢谢!)但是，一旦超出这个范围，事件处理程序仍然存在未连接是因为网格定义是通过 AJAX 检索的，并且当我尝试绑定(bind) ondblclickrow 时它不存在。解决方案很简单:我只是将 async: false 添加到网格定义调用中，以便我知道在绑定(bind)其他事件处理程序等之前定义将始终存在。我正在通过 AJAX 检索网格定义，因为我正在 ASP.NET MVC 应用程序的服务器端动态构建网格。我仍在异步检索网格的数据。现在效果很好。

Answer 1

尝试以下代码

$('#my-grid').jqGrid('setGridParam',
                     { ondblClickRow: function(){console.log('Hello');} });

在许多情况下都可以工作(请参阅 this 和 this 关于同一主题的答案)，但它不起作用。问题是在 jqGrid 初始化期间将测试是否定义了 ondblClickRow 的事件处理程序。如果未定义(请参阅 the source code )，则不会绑定(bind)双击，并且稍后设置 ondblClickRow 不会执行任何操作。

因此，为了能够在 jqGrid 初始化完成后设置 ondblClickRow，您必须自己绑定(bind) dblclick 。您可以使用以下代码来完成此操作:

var grid = $('#customer-list');
grid.dblclick(function(e) {
    var td = e.target;
    var ptr = $(td,grid[0].rows).closest("tr.jqgrow");
    if($(ptr).length === 0 ){return false;}
    var ri = ptr[0].rowIndex;
    var ci = $.jgrid.getCellIndex(td);
    var rowId = $(ptr).attr("id");
    alert("in ondblClickRow");
    //ts.p.ondblClickRow.call(grid[0],rowId,ri,ci, e);
    return false;
});

注释行 ts.p.ondblClickRow.call(grid[0],rowId,ri,ci, e) 显示 ondblClickRow 的所有输入参数我们已经有。