如何从 Gridview 隐藏复选框

Question

我有两个链接按钮 lnkbtn_upcoming 和 lnkbtn_previous，当任何一个链接按钮点击意味着然后复选框应该隐藏。下面是我的网格视图代码：

<asp:GridView ID="Employeedob" runat="server" AutoGenerateColumns="False" GridLines="None" CssClass="mGrid"
           ShowHeader="False" OnRowDataBound="Employeedob_RowDataBound1">
           <Columns>


    <asp:TemplateField>
<ItemTemplate>
    <span class="name">
        <asp:Label ID="lbl_Ename" Width="150px" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.EmpName") %>'></asp:Label></span>
    <asp:Label ID="lbl_Depart" runat="server" Text='<%# DataBinder.Eval  (Container, "DataItem.CompanyName") %>'>

    </asp:Label>
</ItemTemplate>

 </asp:TemplateField>
   <asp:TemplateField Visible="False">
<ItemTemplate>
    <asp:Label ID="lbl_Email" runat="server" Text='<%# DataBinder.Eval (Container, "DataItem.EmailId") %>'>

    </asp:Label>
</ItemTemplate>
    </asp:TemplateField>
     <asp:TemplateField Visible="False">
<ItemTemplate>
    <asp:Label ID="lbl_Depart2" runat="server" Text='<%# DataBinder.Eval (Container, "DataItem.Department") %>'>

    </asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
    <ItemTemplate>
    <asp:CheckBox ID="CheckBox2" runat="server"  />

</ItemTemplate>
    </asp:TemplateField>
           </Columns>
           <FooterStyle HorizontalAlign="Center" />
           <RowStyle HorizontalAlign="Left" VerticalAlign="Top" />
           <EmptyDataTemplate>
    <center>
      <asp:Label ID="Label12" runat="server" Text="No Birthday avaliable"
  ForeColor="Red"></asp:Label>
      </center>
           </EmptyDataTemplate>
       </asp:GridView>

我的链接按钮设计代码：

  <ul class="pagination pull-right" style="margin: 0px;">
                                    <li>
                                        <asp:LinkButton ID="lnkbtn_Previous"
                                            runat="server"
                                            CssClass="btn btn-primary"
                                            OnClick="lnkbtn_Previous_Click">
<span aria-hidden="true" class="glyphicon glyphicon-chevron-left"></span>
                                        </asp:LinkButton></li>
                                    <li>

                                        <asp:LinkButton ID="lnkbtn_Upcoming"
                                            runat="server"
                                            CssClass="btn btn-primary"
                                            OnClick="lnkbtn_Upcoming_Click">
<span aria-hidden="true" class="glyphicon glyphicon-chevron-right"></span>
                                        </asp:LinkButton></li>
                                </ul>

我正在尝试链接按钮 lnkbtn_upcoming 和 lnkbtn_previous，当任何链接按钮单击意味着复选框应该隐藏时。单击任何链接按钮时，复选框应隐藏或不显示。

Answer 1

如果我错了，请纠正我，但我假设您希望在单击 lnkbtn_Previous 或 lnkbtn_Upcoming 时隐藏 GridView 的所有复选框。

客户端

我肯定会在 Javascript 和 jQuery 中做到这一点。

首先在您的复选框中添加一个类：

    <asp:CheckBox ID="CheckBox2" runat="server" CssClass="hide-on-click" />

然后，添加一个 javascript 函数来隐藏/显示复选框：

    function toggleCheckboxes(show) {
        // this jquery retrieves an array of 
        // DOM elements with class hide-on-click
        var checkboxes = $('.hide-on-click');
        // look for jQuery API, there must be a function
        // that takes a bool as show/hide parameter
        if (show) checkboxes.show();
        else checkboxes.hide();
    }

最后，在你的 javascript lnkbtn_Upcoming_Click() 和 lnkbtn_Previous_Click() 函数中，调用上面的函数。

服务器端

应该避免这种情况，因为它需要服务器往返（回发），但您可能想知道如何定位特定的复选框，因为它只有一个 ID，而且会重复。

如果您想为您的复选框生成涉及唯一 ID 的客户端代码 (javascript)：

• 转到或生成GridView_RowDataBound 方法
• 检索复选框：var cb = e.Row.FindControl("CheckBox2");
• 使用其 ClientID 字段将其针对 Javascript/jQuery/CSS：var domId = cb.ClientID;

Answer 2

我可以在 LinkBut​​ton 点击​​事件中隐藏复选框：

   protected void lnkbtn_Previous_Click(object sender, EventArgs e)
   {
       foreach (GridViewRow row in Employeedob.Rows)
       {
       var chk = row.FindControl("CheckBox2") as CheckBox;
       chk.Visible = false;
       }
   }