简体   繁体   中英

Enable/disable text box in Gridview

I want to disable the textbox when the checkbox is checked in a user control (ACSX page). These controls are in a gridview.

<div>
  <asp:GridView ID="gvModifOuvrageNonControles" runat="server" AutoGenerateColumns="false" SkinID="MarionGridView">
    <Columns>
      <asp:TemplateField HeaderText="NO CONTROL">
        <ItemTemplate>
          <asp:CheckBox ID="cbInspection" OnClick="grisé(this);" runat="server" />
        </ItemTemplate>
      </asp:TemplateField>
      <asp:TemplateField HeaderText="RAISON">
        <ItemTemplate>
          <asp:TextBox ID="txtCause" runat="server"></asp:TextBox>
        </ItemTemplate>
      </asp:TemplateField>
    </Columns>
  </asp:GridView>
</div>
function grisé(obj) {
  alert(obj.getAttribute('id'));
}

I am assuming this grid has 3 columns ie 2 Template field and one BoundField cause it will be needed while grabing the textbox..

在此处输入图片说明

<body>
    <form id="form1" runat="server">
        <div>
            <asp:GridView ID="gvModifOuvrageNonControles" runat="server" AutoGenerateColumns="false">
                <Columns>
                    <asp:BoundField DataField="ID" HeaderText="ID" />
                    <asp:TemplateField HeaderText="NO CONTROL">
                        <ItemTemplate>
                            <asp:CheckBox ID="cbInspection" OnClick="grisé(this);" runat="server" />
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="RAISON">
                        <ItemTemplate>
                            <asp:TextBox ID="txtCause" runat="server"></asp:TextBox>
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
        </div>
        <script>
            //all disabled at first..
            (function () {
                debugger;
               var gvDrv = document.getElementById("<%=gvModifOuvrageNonControles.ClientID %>");
                for (i = 1; i < gvDrv.rows.length; i++) {
                    var cell = gvDrv.rows[i].cells[2];
                    cell.firstElementChild.disabled = true
                }
            })();


            function grisé(obj) {
                debugger;
                var rowData = obj.parentNode.parentNode;
                if (obj.checked) {
                    rowData.cells[2].firstElementChild.disabled = false
                }
                else {
                    rowData.cells[2].firstElementChild.disabled = true;
                }
            }

        </script>
    </form>
</body>

   --------------- code behind ----------------
 if (!IsPostBack)
        {
            BindGrid();
        }
    }

    private void BindGrid()
    {
        DataTable dt = new DataTable();
        dt.Columns.Add("ID");
        for (int i = 0; i < 10; i++)
        {
            var r = dt.NewRow();
            r["ID"] = i;
            dt.Rows.Add(r);
        }
        gvModifOuvrageNonControles.DataSource = dt;
        gvModifOuvrageNonControles.DataBind();
    }

The first thing you must do is set the PostBack property of the checkbox to true.

Then you have to iterate through the gridview's item template and find the checkbox using the FindControl method.

Once the checkbox control is found you will need to create an event handler for the checkbox and when it is checked,and, again using the FindControl method, find the textbox within the gridview and perform your action.

This is done in the code behind for your user control. It's a cleaner approach, rather than trying to write a huge script for just one action.

Please note that I am not at my PC so I can't provide an example for the code.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM