Member 13044689 Ответов: 1

Отображение и скрытие столбцов в зависимости от флажка в JavaScript

Здравствуйте, я хочу, чтобы скрыть и показать столбцы в GridView в основе флажок я сделал полдела, но я сталкиваюсь с проблемой, я использовал JavaScript и все ВАР значение может скрывать или показывать хорошо, но когда я использую число значение типа int или sth еще, это не работает, тех. проблемы с общей колонне, которая имеет номер значение я думаю, что ВАР декларация проблему some1help

Что я уже пробовал:

<script type="text/javascript">
    $(function () {
        $("[id*=chkCountry]").click(function () {
            var isChecked = $(this).is(":checked");
            var th = $("[id*=GridView1] th:contains('Country')");
            th.css("display", isChecked ? "" : "none");
            $("[id*=GridView1] tr").each(function () {
                $(this).find("td").eq(th.index()).css("display", isChecked ? "" : "none");
            });
        });
    });
    $(function () {
        $("[id*=Name]").click(function () {
            var isChecked = $(this).is(":checked");
            var th = $("[id*=GridView1] th:contains('Name')");
            th.css("display", isChecked ? "" : "none");
            $("[id*=GridView1] tr").each(function () {
                $(this).find("td").eq(th.index()).css("display", isChecked ? "" : "none");
            });
        });
    });

    $(function () {
        $("[id*=chktotal]").click(function () {
            var isChecked = $(this).is(":checked");
            var th = $("[id*=GridView1] th:contains('Total')");
            th.css("display", isChecked ? "" : "none");
            $("[id*=GridView1] tr").each(function () {
                $(this).find("td").eq(th.index()).css("display", isChecked ? "" : "none");
            });
        });
    });

Afzaal Ahmad Zeeshan

Если вы используете jQuery, почему бы вам не начать использовать пользовательский интерфейс jQuery? Он имеет несколько превосходных доступных элементов управления, которые вы можете реализовать — элементы управления, которые уже имеют эти функции.

Karthik_Mahalingam

почему бы не скрыть () вместо css ("display", isChecked ? "" : "none");

Member 13044689

хорошо, если вы порекомендуете другой метод скрытия и отображения столбца на основе флажка в gridview, вы можете привести мне пример, я буду признателен

Karthik_Mahalingam

разместите соответствующий код для того же самого
разметить

Member 13044689

&ЛТ;АСП:таблицы с ID="gridview1, на" атрибут runat="сервер" AutoGenerateColumns="ложных"
Свойства backcolor="Белый" необходимо="#CC9966" свойства borderstyle="нет" BorderWidth="1 пиксель"
CellPadding= " 4 "DataKeyNames= "Id" DataSourceID= "SqlDataSource1" >
& lt;колонки>
&ЛТ;как ASP:BoundField datafield в="идентификатор" HeaderText="идентификатор" только для чтения="истинный"
SortExpression= "Id" />
<asp:BoundField DataField=" Name " HeaderText=" Name "SortExpression= "Name" />
<asp:BoundField DataField=" Country "HeaderText=" Country"
SortExpression= "страна" />
<asp:BoundField DataField=" purchesvalue "HeaderText=" purchesvalue"
SortExpression= "purchesvalue" />
<asp:BoundField DataField=" shippingvalue "HeaderText=" shippingvalue"
SortExpression= "shippingvalue" />
<asp:BoundField DataField=" othercharge "HeaderText=" othercharge"
SortExpression= "othercharge" />
<asp:BoundField DataField= "Total" HeaderText= "Total" SortExpression= "Total" />

<FooterStyle BackColor= "#FFFFCC "ForeColor=" #330099 " />
<HeaderStyle BackColor="#990000 "Font-Bold= "True" ForeColor= "#FFFFCC " />
<PagerStyle BackColor= "#FFFFCC "ForeColor=" #330099 "HorizontalAlign= "Center" />
<RowStyle BackColor= "White" ForeColor= "#330099 " />
&ЛТ;SelectedRowStyle свойства backcolor="#FFCC66" шрифт-жирный="истинный" цвет="#663399" /&ГТ;
<SortedAscendingCellStyle BackColor= "#FEFCEB" />
<SortedAscendingHeaderStyle BackColor= "#AF0101" />
<SortedDescendingCellStyle BackColor= "#F6F0C0" />
<SortedDescendingHeaderStyle BackColor= "#7E0000" />

<asp:SQLDATASOURCE ID=" SqlDataSource1 "runat=" сервер"
ConnectionString= " <%$ ConnectionStrings:All_VechConnectionString1 %>"
SelectCommand= "SELECT * FROM [test]" >






((( это мой стол, можете ли вы помочь мне с этим))

Karthik_Mahalingam

что такое chkCountry
разместите также соответствующую контрольную отметку.

Member 13044689

$(функция () {
$("[id*=chkCountry]"). click (функция () {
ВАР этот флажок установлен = $(это).это(":проверено");
var th = $("[id*=GridView1] th:содержит ('Country')");
th. css ("display", isChecked ? "": "none");
$("[id*=GridView1] tr"). each (функция () {
$(этот).найти("тд").эквалайзер(че.индекс()).в CSS("дисплей", этот флажок установлен ? "" : "никто");
});
});
});
$(функция () {
$("[id*=Name]"). click (функция () {
ВАР этот флажок установлен = $(это).это(":проверено");
var th = $("[id*=GridView1] th:содержит ('Name')");
th. css ("display", isChecked ? "": "none");
$("[id*=GridView1] tr"). each (функция () {
$(этот).найти("тд").эквалайзер(че.индекс()).в CSS("дисплей", этот флажок установлен ? "" : "никто");
});
});
});

$(функция () {
$("[id*=chktotal]"). click (функция () {
ВАР этот флажок установлен = $(это).это(":проверено");
var th = $("[id*=GridView1] th:содержит ('Total')");
th. css ("display", isChecked ? "": "none");
$("[id*=GridView1] tr"). each (функция () {
$(этот).найти("тд").эквалайзер(че.индекс()).в CSS("дисплей", этот флажок установлен ? "" : "никто");
});
});
});


первые 2 флажка работают gd но когда он доходит до последней функции total one its not working этот столбец имеет числовое значение
спасибо вам сэр

Member 13044689

&ЛТ;как ASP:CheckBoxList с ИД="ChkCountry" атрибут runat="сервер"и GT;

&ЛТ;как ASP:CheckBoxList с ID="имя" атрибут runat="сервер"и GT;

&ЛТ;как ASP:CheckBoxList с ИД="Chktotal" атрибут runat="сервер"и GT;

Karthik_Mahalingam

вложите код с тегом & lt; pre >

Member 13044689

его не сработало главная проблема заключается в том, что когда столбец объявлен как int и включает номер, он не скрывается, а значение var, такое как name country, работает хорошо idk действительно

Member 13044689

& lt;название>

тело
{
семейство шрифтов: Arial;
размер шрифта: 10pt;
}
стол
{
граница: 1px solid #ccc;
границы-крах: крах;
цвет фона: #fff;
}
стол че
{
цвет фона: #B8DBFD;
цвет: #333;
шрифт-вес: жирный;
}
стол-ом, стол тд
{
прокладка: 5px;
граница: 1px solid #ccc;
}
стол, стол настольный тд
{
граница: 0px solid #ccc;
}












<asp:CheckBox ID=" CheckBox1 "Text=" Purches Value " runat=" server "Checked= "true" />






&ЛТ;АСП:таблицы с ID="gridview1, на" атрибут runat="сервер" AutoGenerateColumns="ложных"
Свойства backcolor="Белый" необходимо="#CC9966" свойства borderstyle="нет" BorderWidth="1 пиксель"
CellPadding= " 4 "DataKeyNames= "Id" DataSourceID= "SqlDataSource1" >
& lt;колонки>
&ЛТ;как ASP:BoundField datafield в="идентификатор" HeaderText="идентификатор" только для чтения="истинный"
SortExpression= "Id" />
<asp:BoundField DataField=" Name " HeaderText=" Name "SortExpression= "Name" />
<asp:BoundField DataField=" Country "HeaderText=" Country"
SortExpression= "страна" />
<asp:BoundField DataField=" purchesvalue "HeaderText=" purchesvalue"
SortExpression= "purchesvalue" />
<asp:BoundField DataField=" shippingvalue "HeaderText=" shippingvalue"
SortExpression= "shippingvalue" />
<asp:BoundField DataField=" othercharge "HeaderText=" othercharge"
SortExpression= "othercharge" />
<asp:BoundField DataField= "Total" HeaderText= "Total" SortExpression= "Total" />

<FooterStyle BackColor= "#FFFFCC "ForeColor=" #330099 " />
<HeaderStyle BackColor="#990000 "Font-Bold= "True" ForeColor= "#FFFFCC " />
<PagerStyle BackColor= "#FFFFCC "ForeColor=" #330099 "HorizontalAlign= "Center" />
<RowStyle BackColor= "White" ForeColor= "#330099 " />
&ЛТ;SelectedRowStyle свойства backcolor="#FFCC66" шрифт-жирный="истинный" цвет="#663399" /&ГТ;
<SortedAscendingCellStyle BackColor= "#FEFCEB" />
<SortedAscendingHeaderStyle BackColor= "#AF0101" />
<SortedDescendingCellStyle BackColor= "#F6F0C0" />
<SortedDescendingHeaderStyle BackColor= "#7E0000" />

<asp:SQLDATASOURCE ID=" SqlDataSource1 "runat=" сервер"
ConnectionString= " <%$ ConnectionStrings:All_VechConnectionString1 %>"
SelectCommand= "SELECT * FROM [test]" >


$(функция () {
$("[id*=CheckBox1]"). click (функция () {
ВАР этот флажок установлен = $(это).это(":проверено");
var th = $("[id*=GridView1] th:содержит ('Purches Value')");
th. css ("display", isChecked ? "": "none");
$("[id*=GridView1] tr"). each (функция () {
$(этот).найти("тд").эквалайзер(че.индекс()).в CSS("дисплей", этот флажок установлен ? "" : "никто");
});
});
});





это весь код от начала до конца, мне нужно скрыть имя столбца значение покупки, когда я обедаю код и установите флажок скрывает значение общего столбца, который включает в себя строку ex (ab, cc, dd), но когда я использую ту же функцию со страной и именем, которые имеют строковое значение ex(dan, usa), он работает хорошо, почему это происходит?

Karthik_Mahalingam

обратитесь к моему решению

Member 13044689

спасибо вам сэр теперь он работает я идиот извините что отнял у вас время

Karthik_Mahalingam

все нормально. учиться на ошибках-это первый шаг к успеху.

1 Ответов

Рейтинг:
10

Karthik_Mahalingam

см. этот пример

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script>
        $(function () {
            $('.chkcls').change(function (a, b) {
                var isChecked = a.target.checked;
                var grid = document.getElementById('<%= gv.ClientID%>');
                var target = $(this).attr('column-control');
                var targetTH = $("th:contains('" + target + "')", grid);
                var index = $('th', grid).index(targetTH);
                $('tr', grid).each(function (i, row) { $('td:nth(' + index + ')', row).css("display", isChecked ? "" : "none"); });
                targetTH.css("display", isChecked ? "" : "none");


            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">

        <asp:GridView ID="gv" runat="server" AutoGenerateColumns="false">
            <Columns>
                <asp:BoundField DataField="Id" HeaderText="Id" ReadOnly="True"
                    SortExpression="Id" />
                <asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
                <asp:BoundField DataField="Country" HeaderText="Country"
                    SortExpression="Country" />

            </Columns>
        </asp:GridView>


        <asp:CheckBox AutoPostBack="false" Checked="true" column-control="Id" CssClass="chkcls" runat="server" ID="chkid" Text="show hide id" />
        <asp:CheckBox AutoPostBack="false" Checked="true" column-control="Name" CssClass="chkcls" runat="server" ID="chkname" Text="show hide name" />
        <asp:CheckBox AutoPostBack="false" Checked="true" column-control="Country" CssClass="chkcls" runat="server" ID="chkcountry" Text="show hide country" />

    </form>
</body>
</html>




protected void Page_Load(object sender, EventArgs e)
       {
           if (!Page.IsPostBack)
           {
               DataTable dt = new DataTable();
               dt.Columns.Add("ID");
               dt.Columns.Add("Name");
               dt.Columns.Add("Country");
               dt.Rows.Add(1, "AA", "India");
               dt.Rows.Add(2, "bb", "US");
               dt.Rows.Add(3, "cc", "UK");
               gv.DataSource = dt;
               gv.DataBind();
           }


       }