Access Child Controls in Gridview Using Javascript.
Description:
AccessChildGridviewInJavascript.aspx:
In this example I am explaining about how to access child Controls in Gridview using Javascript ,here i am multiplying the Empcode Column 10 times and pushing to EmpSal Column
EmpSal= Empcode*10
AccessChildGridviewInJavascript.aspx:
<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="AccessChildGridviewInJavascript.aspx.cs" Inherits="_Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
<script type="text/javascript">
function ChildControls(gridid, rowindex)
{
var grid = document.getElementById(gridid);
if (grid != null) {
var index_row = grid.rows.length
var row = grid.rows[rowindex];
var cell = grid.rows[rowindex].cells;
var cellsvalueCode = cell[4].firstChild.value;
cell[5].firstChild.value = cellsvalueCode * 10
}
}
</script>
<asp:GridView runat="server" ID="gvEmpdetails" DataKeyNames="EmpID" DataSourceID="EmpDetails"
AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False" OnRowDataBound="gvEmpdetails_RowDataBound">
<RowStyle BackColor="#EFF3FB" />
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
<Columns>
<asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox runat="server" ID="chkhead" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chk" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="EmpID" HeaderText="EmpID" SortExpression="EmpID" />
<asp:BoundField DataField="EmpName" HeaderText="EmpName" SortExpression="EmpName" />
<asp:BoundField DataField="EmpBranch" HeaderText="EmpBranch" SortExpression="EmpBranch" />
<asp:TemplateField HeaderText="EmpCode">
<ItemTemplate>
<asp:TextBox ID="txt1" Text='<%# Eval("EmpCode") %>' runat="server" ></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="EmpSal">
<ItemTemplate>
<asp:TextBox ID="txt2" Text='<%# Eval("EmpSal") %>' runat="server" ></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="EmpDetails" runat="server" ConnectionString="<%$ ConnectionStrings:CustomerConnectionString %>"
SelectCommand="SELECT [EmpID], [EmpName], [EmpSal], [EmpBranch], [EmpCode] FROM [Employee]">
</asp:SqlDataSource>
</asp:Content>
AccessChildGridviewInJavascript.aspx.cs:
Call the javascript method in Rowdatabound event,by Identifying the textbox as follows
protected void gvEmpdetails_RowDataBound(object sender, GridViewRowEventArgs e)
{
rowindex = e.Row.RowIndex;
//This condition is used to check RowType is Header
if (e.Row.RowType == DataControlRowType.DataRow)
{
//Find the checkbox control in header and add an attribute
if (gvEmpdetails.Rows.Count > 0)
{
TextBox txt = (TextBox)gvEmpdetails.Rows[rowindex - 1].FindControl("txt1");
txt.Attributes.Add("onChange", "javascript:ChildControls('" +
gvEmpdetails.ClientID + "','" + rowindex + "')"); }
}
}
Subscribe to:
Post Comments (Atom)
0 Responses to “Access Child Controls in Gridview Using Javascript.”
Post a Comment