【问题标题】:Get GridView selected row DataKey in Javascript在Javascript中获取GridView选定的行DataKey
【发布时间】:2010-09-18 17:13:28
【问题描述】:

我有 GridView,我可以选择一行。然后,我在网格上方有一个名为 Edit 的按钮,用户可以单击该按钮弹出一个窗口并编辑选定的行。所以按钮后面会有 Javascript 代码

function editRecord()
{
  var gridView = document.getElementById("<%= GridView.ClientID %>");
  var id = // somehow get the id here ???
  window.open("edit.aspx?id=" + id);
}

问题是如何在javascript中检索选定的记录ID?

【问题讨论】:

    标签: asp.net javascript gridview


    【解决方案1】:

    可以完全避免使用 javascript,方法是为每一行设置预填充查询字符串的锚标记(虽然这会影响您的表格布局,但只需单击一次,而不是用户单击 2 次)

    在gridview模板中插入:

    <asp:HyperLink runat="server" ID="editLink" Target="_blank"
       NavigateURL='<%# Eval("JobID","edit.aspx?id={0}") %>'> 
         Edit..
    </asp:HyperLink>
    

    【讨论】:

      【解决方案2】:

      我是根据 JasonS 的回复得出的。我所做的是在网格视图中创建一个隐藏字段,如下所示:

      <asp:TemplateField ShowHeader="False">
          <ItemTemplate>
            <asp:HiddenField ID="hdID" runat="server" Value='<%# Eval("JobID") %>' />
          </ItemTemplate>
      </asp:TemplateField>
      <asp:TemplateField Visible="False">
          <ItemTemplate>
            <asp:LinkButton ID="lnkSelect" runat="server" CommandName="select" Text="Select" />
          </ItemTemplate>
      </asp:TemplateField>
      

      然后在 OnRowDataBind 上有代码来设置选中的行

      protected virtual void Grid_RowDataBound(object sender, GridViewRowEventArgs e)
      {
          if (e.Row.RowType == DataControlRowType.DataRow)
          {
              // Click to highlight row
              Control lnkSelect = e.Row.FindControl("lnkSelect");
              if (lnkSelect != null)
              {
                  StringBuilder click = new StringBuilder();
                  click.AppendLine(m_View.Page.ClientScript.GetPostBackClientHyperlink(lnkSelect, String.Empty));
                  click.AppendLine(String.Format("onGridViewRowSelected('{0}')", e.Row.RowIndex));
                  e.Row.Attributes.Add("onclick", click.ToString());
              }
          }            
      }
      

      然后在 Javascript 中我有这样的代码

      <script type="text/javascript">
      
      var selectedRowIndex = null;
      
      function onGridViewRowSelected(rowIndex)
      {        
          selectedRowIndex = rowIndex;
      }
      
      function editItem()
      {   
          if (selectedRowIndex == null) return;
      
          var gridView = document.getElementById('<%= GridView1.ClientID %>');                
          var cell = gridView.rows[parseInt(selectedRowIndex)+1].cells[0];        
          var hidID = cell.childNodes[0];        
          window.open('JobTypeEdit.aspx?id=' + hidID.value);
      }
      
      </script> 
      

      工作愉快:-)

      【讨论】:

      • 我基本上就是这样做的。
      • 什么是 m_View 我不知道我想在那个地方放什么
      • 你也许可以摆脱 m_View 并且它应该可以工作。这段代码使用 MVP 模式,有点不同。
      【解决方案3】:

      根据您的 cmets 对 @DaveK 的响应,在 javascript 中,您可以在用户选择它时将隐藏字段的 id 设置为所选行的 clientId。然后让您的 editRecord 函数使用在隐藏表单字段上设置的值。

      【讨论】:

        【解决方案4】:

        1) 更改您的 javascript 函数以使用参数

        function editRecord(clientId)
        { ....
        

        2) 在您的 editRecord 按钮中输出调用...如果您想避免处理 .net 生成的 id,只需使用一个简单的

        <input type="button" onclick="editRecord(your-rows-client-id-goes-here)" />
        

        【讨论】:

        • 如果我在每一行都有一个编辑按钮,这将有效。但我在网格上方的工具栏上的整个页面上只有 1 个编辑按钮。所以工作流程是有人选择一条记录,然后单击工具栏上的编辑。没有办法将 id 传递给 editRecord 函数。
        • Dave,我如何在此处获取行客户端 ID?
        猜你喜欢
        • 2011-02-18
        • 2011-11-13
        • 1970-01-01
        • 1970-01-01
        • 2015-08-15
        • 2011-03-25
        • 1970-01-01
        • 2016-06-21
        • 1970-01-01
        相关资源
        最近更新 更多