Question

Ola - 我有一个asp:Gridview我总是希望显示0（Locale） - 现在剩下的是隐藏的，除非从复选框列表中选中相应的复选框。

这是我的sytnax - 我如何在jquery或javascript中实现这一点？

    <div>    
    <asp:CheckBoxList ID="checkboxlist1" runat="server" RepeatLayout="table" RepeatColumns="2" RepeatDirection="vertical"></asp:CheckBoxList>    
</div>

<div id="dgv">
        <asp:GridView ID="gridviewpeople" runat="server" CssClass="Grid" AutoGenerateColumns="false">
    <Columns>
        <asp:BoundField DataField="Locale" HeaderText="Location" />
        <asp:BoundField DataField="James" HeaderText="James" />
        <asp:BoundField DataField="Joe" HeaderText="Joe" />
        <asp:BoundField DataField="Jack" HeaderText="Jack" />
        <asp:BoundField DataField="Frank" HeaderText="Frank" />
        <asp:BoundField DataField="Larry" HeaderText="Larry" />
    </Columns>
</asp:GridView>

修改
我尝试下面的JQuery - 但是单击复选框时不显示列。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("[id*=chkCountry]").click(function () {
            var isChecked = $(this).is(":checked");
            var th = $("[id*=gridviewpeople] th:contains('James')");
            th.css("display", isChecked ? "" : "none");
            $("[id*=gridviewpeople] tr").each(function () {
                $(this).find("td").eq(th.index()).css("display", isChecked ? "" : "none");
            });
            var th1 = $("[id*=gridviewpeople] th1:contains('Joe')");
            th1.css("display", isChecked ? "" : "none");
            $("[id*=gridviewpeople] tr").each(function () {
                $(this).find("td").eq(th1.index()).css("display", isChecked ? "" : "none");
            });
            var th2 = $("[id*=gridviewpeople] th2:contains('Jack')");
            th2.css("display", isChecked ? "" : "none");
            $("[id*=gridviewpeople] tr").each(function () {
                $(this).find("td").eq(th2.index()).css("display", isChecked ? "" : "none");
            });
            var th3 = $("[id*=gridviewpeople] th3:contains('Jack')");
            th3.css("display", isChecked ? "" : "none");
            $("[id*=gridviewpeople] tr").each(function () {
                $(this).find("td").eq(th3.index()).css("display", isChecked ? "" : "none");
            });
            var th4 = $("[id*=gridviewpeople] th4:contains('Frank')");
            th4.css("display", isChecked ? "" : "none");
            $("[id*=gridviewpeople] tr").each(function () {
                $(this).find("td").eq(th4.index()).css("display", isChecked ? "" : "none");
            });
            var th5 = $("[id*=gridviewpeople] th5:contains('Larry')");
            th5.css("display", isChecked ? "" : "none");
            $("[id*=gridviewpeople] tr").each(function () {
                $(this).find("td").eq(th5.index()).css("display", isChecked ? "" : "none");
            });
        });
    });
</script>

Answer 1

你可以根据你的复选框列表

尝试使用JQuery

基于复选框列表在网格视图中显示多个列

1 个答案: