单击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

首先，您应该选择符合您要求的最佳回调。 通常，这将是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 ），则最后一种方法是最好的。

更新 ：在发表了一些评论并更新了问题的文本之后，我看到您将jqSuite用于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 2

以下是代码，通过进行一些修改，可以帮助您获取所需的用户代码

    <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" 

宽度=“ 600px”>

以下是为您提供列ID的jQuery

<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>

或检查以下URL：

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

Answer 3

请通读API。

希望这是您正在寻找的东西： http : //www.trirand.com/jqgridwiki/doku.php?id= wiki: events

onSelectRow事件

Answer 4

最终，从Example中得到了很多帮助，因此解决方案是在jqGrid的Rowselecting事件上，我使用jqGrid.SelectedRow获得了单元格的值。

例：

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

PS Oleg非常感谢您的慷慨帮助。