Dynamically Add JavaScript To The Grid View TextBox

Dynamically adding the java script function to the grid view text box. Create the texbox and add java script to the dynamically created text box in grid view.

Create the texbox and add JavaScript to the dynamically created textbox in Grid View.

 

ASPX Code (Design View)

 

We need a RowCreated event to bind textbox for each column in a row.

<asp:GridView ID="GridView1" runat="server" OnRowCreated="GridView1_RowCreated"
OnRowDataBound="GridView1_RowDataBound" ></asp:GridView>

Code behild (.CS) code

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
       {
           try
           {
               if (e.Row.RowType == DataControlRowType.DataRow)
               {

                   for (int colIndex = 5; colIndex < e.Row.Cells.Count; colIndex++)
                   {
                           int rowIndex = colIndex;
                           TextBox txtName = new TextBox();
                           txtName.Width = 16;
                           txtName.ID = "txtGiveQty" + colIndex;
                           string txtID = "txtGiveQty" + colIndex;
                           e.Row.Cells[colIndex].Controls.Add(txtName);
                           txtName.Attributes.Add("onChange", "return SetBalanceAmountGID(this,'"+locationame +"','txtGiveQty')");
                           txtName.AutoPostBack = true;
                           e.Row.Cells[colIndex].Controls.Add(txtName);

                       }
                   }
               }

           }
           catch (Exception ex)
           {
           }

       }

Description

1. e.Row.Cells.Count -- This will gives you number of columns in the grid view
2. txtName.ID = "txtboxname" + colIndex; -- Creating new textbox, creating ID for and binding the ID to the textbox
3. txtName.AutoPostBack = true; -- Enabling postback funtion for the particular textbox ID to enable events
4. e.Row.Cells[colIndex].Controls.Add(txtName); - Adding textbox item to the grivew(Colindex- column number)
5. textbox.Attributes.Add("onChange", "return function(paramaters)");
    
   Eg : textbox.Attributes.Add("onChange", "return SetBalanceAmountGID(this,'1')");

Java script

function SetBalanceAmountGID(obj, value) {

         alert(value)
// Write the script here
}

We can also add multiple textboxes and multiple items like labels, button, etc.