Aspdotnet-Suresh

aspdotnet-suresh offers C#.net articles and tutorials,csharp dot net,asp.net articles and tutorials,VB.NET Articles,Gridview articles,code examples of asp.net 2.0 /3.5,AJAX,SQL Server Articles,examples of .net technologies

How to Get (Access) Gridview Footer Controls id in JavaScript

Nov 4, 2014
Introduction

Here I will explain how to access or get 
asp.net gridview footer control ids or values in JavaScript or find controls inside gridview in JavaScript or find asp.net gridview footer controls (textbox, dropdownlist, checkbox, radio button etc..) values or ids in JavaScript.


To get asp.net gridview footer control ids or values in JavaScript we need to write the code like as shown below

Syntax to Get Gridview Footer Controls in JavaScript


<script type="text/javascript">
function GetGridFooterRowvalues() {
var fuid = document.getElementById('<%=((TextBox)gvUserInfo.FooterRow.FindControl("txtUserId")).ClientID %>');
if (fuid != null && funame != null && fueducation != null) {
alert('UserId:' + fuid.value)
}
}
</script>
If you want see it in complete example open your aspx page and write the following code


<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>get gridview footer control id in javascript</title>
<script type="text/javascript">
function GetGridFooterRowvalues() {
var fuid = document.getElementById('<%=((TextBox)gvUserInfo.FooterRow.FindControl("txtUserId")).ClientID %>');
var funame = document.getElementById('<%=((TextBox)gvUserInfo.FooterRow.FindControl("txtUserName")).ClientID %>');
var fueducation = document.getElementById('<%=((TextBox)gvUserInfo.FooterRow.FindControl("txtEducation")).ClientID %>');
if (fuid != null && funame != null && fueducation != null) {
alert('UserId:' + fuid.value + ';UserName:' + funame.value + ';Education:' + fueducation.value)
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="gvUserInfo" runat="server" AutoGenerateColumns="false" ShowFooter="true">
<HeaderStyle BackColor="#df5015" Font-Bold="true" ForeColor="White" />
<Columns>
<asp:TemplateField HeaderText="UserId">
<ItemTemplate>
<asp:Label id="lblUserid" runat="server"  Text='<%# Eval("UserId") %>' />
</ItemTemplate>
<FooterTemplate>
<asp:TextBox ID="txtUserId" runat="server" Text="100" />
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="UserName">
<ItemTemplate>
<asp:Label id="lblUsername" runat="server" Text='<%# Eval("UserName") %>'/>
</ItemTemplate>
<FooterTemplate>
<asp:TextBox ID="txtUserName" runat="server" Text="SureshD" />
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Education">
<ItemTemplate>
<asp:Label id="lblEducation" runat="server" Text='<%# Eval("Education") %>'/>
</ItemTemplate>
<FooterTemplate>
<asp:TextBox ID="txtEducation" runat="server" Text="B.Tech" />
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:Button ID="btnGet" Text="Get Footer Values" runat="server" OnClientClick="GetGridFooterRowvalues()" />
</div>
</form>
</body>
</html>
After that write the following code in code behind

C# Code


using System;
using System.Data;

public partial class Default3 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            DataTable dt = new DataTable();
            dt.Columns.Add("UserId", typeof(Int32));
            dt.Columns.Add("UserName", typeof(string));
            dt.Columns.Add("Education", typeof(string));
            dt.Rows.Add(1, "Suresh Dasari", "B.Tech");
            dt.Rows.Add(2, "Rohini Dasari", "Msc");
            dt.Rows.Add(3, "Madhav Sai", "MS");
            dt.Rows.Add(4, "Praveen", "B.Tech");
            dt.Rows.Add(6, "Sateesh", "MD");
            dt.Rows.Add(7, "Mahesh Dasari", "B.Tech");
            dt.Rows.Add(8, "Mahendra", "CA");
            gvUserInfo.DataSource = dt;
            gvUserInfo.DataBind();
        }
    }
}
VB.NET Code


Imports System.Data
Partial Class _Default
    Inherits System.Web.UI.Page
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
        If Not IsPostBack Then
            Dim dt As New DataTable()
            dt.Columns.Add("UserId", GetType(Int32))
            dt.Columns.Add("UserName", GetType(String))
            dt.Columns.Add("Education", GetType(String))
            dt.Rows.Add(1, "Suresh Dasari", "B.Tech")
            dt.Rows.Add(2, "Rohini Dasari", "Msc")
            dt.Rows.Add(3, "Madhav Sai", "MS")
            dt.Rows.Add(4, "Praveen", "B.Tech")
            dt.Rows.Add(6, "Sateesh", "MD")
            dt.Rows.Add(7, "Mahesh Dasari", "B.Tech")
            dt.Rows.Add(8, "Mahendra", "CA")
            gvUserInfo.DataSource = dt
            gvUserInfo.DataBind()
        End If
    End Sub
End Class
Demo

 How to Get (Access) Gridview Footer Controls id in JavaScript

If you enjoyed this post, please support the blog below. It's FREE!

Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email.

subscribe by rss Subscribe by RSS subscribe by email Subscribe by Email

1 comments :

Anonymous said...

how to get particular row's control value?

Give your Valuable Comments

Note: Only a member of this blog may post a comment.

© 2015 Aspdotnet-Suresh.com. All Rights Reserved.
The content is copyrighted to Suresh Dasari and may not be reproduced on other websites without permission from the owner.