单击jqGrid中的一行获取列的值

Question

我正在使用 Asp.Net/C# ，在我的一个页面中，我使用 jqGrid 向 Admin 显示用户列表，jqGrid 包含以下列

1. 用户代码
2. 名字
3. 中间名
4. 姓氏
5. 电子邮件

这是我的标记

<cc1:JQGrid ID="ModifyAccountUserDetailsjqGrid"    AppearanceSettings-Caption="User Details"         runat="server" Width=800   DataSourceID=ModifyAccountDataSource>
    <Columns>
    <cc1:JQGridColumn HeaderText="User Code" ShowToolTip=false   PrimaryKey=true    DataField="UserCode"></cc1:JQGridColumn>
    <cc1:JQGridColumn HeaderText="First Name" ShowToolTip=false    DataField="FirstName"></cc1:JQGridColumn>
    <cc1:JQGridColumn HeaderText="Middle Name" ShowToolTip=false   DataField="MiddleName"></cc1:JQGridColumn>
    <cc1:JQGridColumn HeaderText="Last Name" ShowToolTip=false     DataField="LastName"></cc1:JQGridColumn>
    <cc1:JQGridColumn HeaderText="Email"  ShowToolTip=false        DataField="Email"></cc1:JQGridColumn>
    <cc1:JQGridColumn HeaderText="Contact No" ShowToolTip=false    DataField="ContactNo"></cc1:JQGridColumn>
    <cc1:JQGridColumn HeaderText="Division Name" ShowToolTip=false   DataField="DivisionName"></cc1:JQGridColumn>
    <cc1:JQGridColumn HeaderText="Last Name" ShowToolTip=false     DataField="BranchName"></cc1:JQGridColumn>
    </Columns> 
</cc1:JQGrid>

我需要的是，当管理员单击一行时，我想获取单击行的用户代码的值。我是 jqGrid 的新手，所以我不知道如何去对这个。 谁能指出我正确的方向。欢迎提出任何建议。

谢谢

Answer 1

最后为了得到我需要的东西，我从 Example 得到了很多帮助，所以解决方案是在 jqGrid 的 Rowselecting 事件上，我使用 jqGrid.SelectedRow 来获取我的单元格的值。

例子：

protected void ModifyAccountUserDetailsjqGrid_RowSelecting(object sender, Trirand.Web.UI.WebControls.JQGridRowSelectEventArgs e)
        {
            ModifyAccountUserDetailsjqGrid.SelectedRow;   
        }

P.S Oleg 非常感谢您的慷慨帮助。非常感谢。

Answer 2

首先，您应该选择符合您要求的最佳回调。通常是onSelectRow，但在某些其他情况下，另一个回调，如onCellSelect、beforeSelectRow 或ondblClickRow 更好。

在回调中，您将rowid（id 或<tr> 行）作为第一个参数。您可以使用getCell、getRowData 或getLocalRow 来获取某个单元格的包含。例如

onSelectRow: function (id) {
    // get data from the column 'userCode'
    var userCode = $(this).jqGrid('getCell', 'userCode');
    alert(userCode);
}

或

onSelectRow: function (id) {
    var localRowData = $(this).jqGrid('getLocalRow');
    alert(localRowData.userCode);
}

如果 jqGrid 有本地数据，最后一种方法是最好的（你使用 datatype: 'local' 或远程数据类型，如 datatype: 'json' 与 loadonce: true 结合使用）。

更新：在 cmets 中发布一些帖子并更新您的问题文本后，我看到您使用 jqSuite for ASP.NET WebForms 或其他一些基于 jqGrid 的商业产品免费的开源 JavaScript 库 jqGrid。我没用过jqSuite，不知道jqSuite应该如何实现JavaScript回调。

我可以建议您使用新的 jqGrid 4.3.2 功能：jQuery like events。你可以做的就是这样的代码

var $grid = jQuery("#<%= ModifyAccountUserDetailsjqGrid.ClientID %>");
$grid.bind("jqGridSelectRow", function (id) {
    var userCode = $(this).jqGrid('getCell', 'userCode');
    alert(userCode);
});

或

var $grid = jQuery("#<%= ModifyAccountUserDetailsjqGrid.ClientID %>");
$grid.bind("jqGridSelectRow", function (id) {
    var localRowData = $(this).jqGrid('getLocalRow');
    alert(localRowData.userCode);
});

“jqGridSelectRow”等事件的事件处理程序可以在创建网格之前或之后定义（但在创建id 等于<%= ModifyAccountUserDetailsjqGrid.ClientID %> 的<table> 元素之后）。此外，如果需要，您可以将更多定义为一个事件处理程序。这是非常实用的，您希望在您的项目中实现所有网格的一些通用操作。

Answer 3

请通读 API。

希望这就是你要找的东西：http://www.trirand.com/jqgridwiki/doku.php?id=wiki:events

onSelectRow 事件

Answer 4

以下代码可帮助您通过一些修改来获取您的案例中的用户代码

    <asp:SqlDataSource runat="server" ID="SqlDataSource1" 
    ConnectionString="<%$ ConnectionStrings:SQL2008_449777_fhsConnectionString %>" 
     SelectCommand="SELECT [OrderID], [RequiredDate], [ShipName],
      [ShipCity], [Freight] FROM [Orders]">    </asp:SqlDataSource>    
      <trirand:JQGrid runat="server" ID="JQGrid1" DataSourceID="SqlDataSource1" 

Width="600px" >

以下是 jquery，它为您提供列 ID

<script type="text/javascript">
function getSelectedRow() { 
       var grid = jQuery("#<%= JQGrid1.ClientID %>");
        var rowKey = grid.getGridParam("selrow");
        if (rowKey)
            alert("Selected row primary key is: " + rowKey); 
          else
            alert("No rows are selected");
      }
    function selectSecondRow() {
        var grid = jQuery("#<%= JQGrid1.ClientID %>");
        grid.setSelection('10249');
        } 
   </script>

或查看以下网址：

http://www.trirand.net/examples/grid/selection/selectedrow_client/default.aspx