【问题标题】:get the corresponding row values for check box checked row in grid view using javacsript使用javascript在gridview中获取复选框选中行的相应行值
【发布时间】:2018-05-08 10:22:54
【问题描述】:

我有以下网格,每行都有复选框,当我选中复选框时,我想获得相应的选定行单元格值。 我可以在选中复选框时发出警报,但不确定如何获取所选行单元格的值..

这是我的网格视图

  <asp:GridView ID="gvPRCertInfo" runat="server" AutoGenerateColumns="False" 
      GridLines="None"                      
      CellSpacing="1" CellPadding="1"
      Width="95%" BorderWidth="0"
      AllowSorting="True"
      PageSize="30"
      OnRowDataBound="gvPRCertInfo_RowDataBound"
      CssClass="data responsive">
      <Columns>
         <asp:TemplateField HeaderText="Select" SortExpression="">
            <HeaderTemplate>
               <asp:CheckBox ID="chkboxSelectAll" runat="server" AutoPostBack="true"  OnCheckedChanged="chkboxSelectAll_CheckedChanged"/>
            </HeaderTemplate>
            <ItemTemplate>
               <asp:CheckBox ID="chkCert" AutoPostBack="true" OnCheckedChanged="chkCert_CheckedChanged" OnClick="checkForVirtual(this);" runat="server" />
               <input type="hidden" id="hdnCertId" runat="server" value='<%# DataBinder.Eval(Container.DataItem, "CertId") %>' />
            </ItemTemplate>
         </asp:TemplateField>
         <asp:BoundField DataField="CertificateID" HeaderText="Certificate ID" HeaderStyle-HorizontalAlign="Center" />
         <asp:BoundField DataField="partID" HeaderText="Part Number" HeaderStyle-HorizontalAlign="Center" />
         <asp:BoundField DataField="PartDesc" HeaderText="Part Description" HeaderStyle-HorizontalAlign="Center" />
         <asp:BoundField DataField="platformType" HeaderText="platformType" Visible="false" />

 ...................................
 ...................................

      </Columns>
      <EmptyDataRowStyle CssClass="AlternatingRowStyle" />     
  </asp:GridView>

这是我的复选框 javascript 函数

  function checkForVirtual(checkBox){
    if(checkBox.checked)
    {
        alert('checked');

       /// here i need to get selected checked row all cells value 
    }
 }

任何人都可以就此提出任何想法,非常感谢我..

非常感谢提前..

【问题讨论】:

    标签: javascript jquery html asp.net gridview


    【解决方案1】:

    你可以这样做。它将一个函数附加到复选框更改,找到最近的tr 并循环所有td

    <script type="text/javascript">
        $(document).ready(function () {
            $('#<%= gvPRCertInfo.ClientID %> input[type="checkbox"]').change(function () {
                $(this).closest('tr').children('td').each(function () {
                    alert($(this).html());
                });
            });
        });
    </script>
    

    但是,您的复选框中有一个 AutoPostBack="true",因此您在 javascript 中所做的一切都会因为 PostBack 而立即丢失。

    【讨论】:

    • 当我比较特定的单元格值时,我将确认消息发送回服务器......就像(是或否)
    • 我不理解您的评论。当您更改复选框时,aspnet 将触发表单发布 (PostBack)。您希望将什么发送到服务器?
    • 它是一种是或否确认消息作为隐藏值,我需要在服务器端发布事件“chkCert_CheckedChanged”中使用
    • 这与在 javascript 中获取行值有什么关系?
    • 嗨对不起..它给出了每一个值我怎样才能获得特定的单元格值你能建议我..
    【解决方案2】:

    试试这个。

    function checkForVirtual(checkBox){
        if(checkBox.checked)
        {
            var row = checkBox.parent.parent;
            row.getElementById('<%= hdnCertId.ClientID %>');// this will get the hdnCertId
            row.cell[0].getElementById('<%= hdnCertId.ClientID %>');
            alert('checked');
    }
    

    }

    This might help

    【讨论】:

    • row 没有引用整行吗?
    • 我在这一行遇到错误 row.getElementById('').. hdnCertId 在当前上下文中不存在..
    • 名称'hdnCertId'在当前上下文中不存在这个错误我得到了
    • 您必须添加 ClientIdMode="Static" 作为控件的属性,例如 hdnCert 控件
    • 还有一件事要尝试尝试 var row = checkBox.parent。对不起,如果这不起作用。
    【解决方案3】:

     <HeaderTemplate>
     <asp:CheckBox ID="chkboxSelectAll"  AutoPostBack="true" OnCheckedChanged="chkboxSelectAll_CheckedChanged" runat="server" Text="All" />
     </HeaderTemplate>
    
     <ItemTemplate>
     <asp:CheckBox ID="chkCert" runat="server" Font-Size="XX-Small" />                                     
     </ItemTemplate>  
    
     </asp:TemplateField>
    

    在cs文件中

    protected void chkboxSelectAll_CheckedChanged(object sender, EventArgs e)
            {
                CheckBox chckheader = (CheckBox)gvPRCertInfo.HeaderRow.FindControl("chkboxSelectAll");
                foreach (GridViewRow row in gvPRCertInfo.Rows)
                {
                    CheckBox CheckBoxchckrw = (CheckBox)row.FindControl("chkCert");
                    if (chckheader.Checked == true)
                    {
                        CheckBoxchckrw.Checked = true;
                    }
                    else
                    {
                        CheckBoxchckrw.Checked = false;
                    }
                }
            }
    

    获取有关按钮单击的详细信息

    protected void button_Click(object sender, EventArgs e)
            {
                try
                {
                    int cnt = 0;
    
                    DataTable dt = new DataTable();
                    dt.Columns.Add("Certificate ID");
                    dt.Columns.Add("Part Number");
                    dt.Columns.Add("Part Description");
    
    
                    foreach (GridViewRow row in gvPRCertInfo.Rows)
                    {
                        if ((row.Cells[0].FindControl("chkCert") as CheckBox).Checked)
                        {
                            DataRow dr = dt.NewRow();
                            dr["Certificate ID"] = row.Cells[1].Text;
                            dr["Part Number"] = row.Cells[2].Text;
                            dr["Part Description"] = row.Cells[3].Text;
    
                            dt.Rows.Add(dr);
                            cnt++;
                        }
                    }
                    if (cnt <= 0)
                    {
                        DataRow dr = dt.NewRow();
                        dr["Certificate ID"] = gvPRCertInfo.SelectedRow.Cells[1].Text;
                        dr["Part Number"] = gvPRCertInfo.SelectedRow.Cells[2].Text;
                        dr["Part Description"] = gvPRCertInfo.SelectedRow.Cells[3].Text;
    
                        dt.Rows.Add(dr);
    
                    }
    
                     Session["Details"] = dt;
                    Response.Redirect("url");
                }
                catch (Exception ex)
                {
    
                }
            }
    

    【讨论】:

      猜你喜欢
      • 2018-05-08
      • 2017-11-03
      • 1970-01-01
      • 2014-07-14
      • 1970-01-01
      • 1970-01-01
      • 2017-01-16
      • 1970-01-01
      • 2018-06-15
      相关资源
      最近更新 更多