در این مقاله قصد داریم با استفاده از CheckBox موجود در کنار هر خط TextBox های همان خط را فعال و یا غیر فعال کنیم

سلام دوستان خوبم

ابتدا در یک صفحه یک گرید ویو قرار میدیم که ستون نام و نام خانوادگی حاوی TextBox مربوط به مقدار خودش هست

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
<Columns>
    <asp:TemplateField>
        <HeaderTemplate>
            <asp:CheckBox ID="chkHeader" runat="server" />
        </HeaderTemplate>
        <ItemTemplate>
            <asp:CheckBox ID="chkRow" runat="server" />
        </ItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="نام">
        <ItemTemplate>
            <asp:TextBox ID="txtName" runat="server" Text='<% # Eval("Name") %>' Enabled="false"></asp:TextBox>
        </ItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="نام خانوادگی">
        <ItemTemplate>
            <asp:TextBox ID="txtCity" runat="server" Text='<% # Eval("Family") %>' Enabled="false"></asp:TextBox>
        </ItemTemplate>
    </asp:TemplateField>
</Columns>
</asp:GridView>

سپس با استفاده از یک DataTable و در رویداد لود صفحه گرید را پر میکنیم

         if (!this.IsPostBack)
            {
                DataTable dt = new DataTable();
                dt.Columns.AddRange(new DataColumn[3] { new DataColumn("Id"), new DataColumn("Name"), new DataColumn("Family") });
                dt.Rows.Add(1, "ایمان", "مدائنی");
                dt.Rows.Add(2, "پرهام", "مدائنی");
                dt.Rows.Add(3, "علی", "محمدی");
                dt.Rows.Add(4, "سارا", "احمدی");
                GridView1.DataSource = dt;
                GridView1.DataBind();
            }

سپس با استفاده از دستورات JavaScript زیر مقادیر و فعال یا غیر فعال بودن TextBox هارو انجام میدیم

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
    //Enable Disable all TextBoxes when Header Row CheckBox is checked.
    $("[id*=chkHeader]").bind("click", function () {
        var chkHeader = $(this);
 
        //Find and reference the GridView.
        var grid = $(this).closest("table");
 
        //Loop through the CheckBoxes in each Row.
        $("td", grid).find("input[type=checkbox]").each(function () {
 
            //If Header CheckBox is checked.
            //Then check all CheckBoxes and enable the TextBoxes.
            if (chkHeader.is(":checked")) {
                $(this).attr("checked", "checked");
                var td = $("td", $(this).closest("tr"));
                td.css({ "background-color": "#D8EBF2" });
                $("input[type=text]", td).removeAttr("disabled");
            } else {
                $(this).removeAttr("checked");
                var td = $("td", $(this).closest("tr"));
                td.css({ "background-color": "#FFF" });
                $("input[type=text]", td).attr("disabled", "disabled");
            }
        });
    });
 
    //Enable Disable TextBoxes in a Row when the Row CheckBox is checked.
    $("[id*=chkRow]").bind("click", function () {
 
        //Find and reference the GridView.
        var grid = $(this).closest("table");
 
        //Find and reference the Header CheckBox.
        var chkHeader = $("[id*=chkHeader]", grid);
 
        //If the CheckBox is Checked then enable the TextBoxes in thr Row.
        if (!$(this).is(":checked")) {
            var td = $("td", $(this).closest("tr"));
            td.css({ "background-color": "#FFF" });
            $("input[type=text]", td).attr("disabled", "disabled");
        } else {
            var td = $("td", $(this).closest("tr"));
            td.css({ "background-color": "#D8EBF2" });
            $("input[type=text]", td).removeAttr("disabled");
        }
 
        //Enable Header Row CheckBox if all the Row CheckBoxes are checked and vice versa.
        if ($("[id*=chkRow]", grid).length == $("[id*=chkRow]:checked", grid).length) {
            chkHeader.attr("checked", "checked");
        } else {
            chkHeader.removeAttr("checked");
        }
    });
});
</script>

نمونه هم ضمیمه شد