Search This Blog

Sunday, September 6, 2015

Finding GridView and Inner Control From JQuery

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="GridView.aspx.cs" Inherits="AjaxApp.GridView" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 <script type="text/javascript" lang="javascript">
        //Find control in Gridview
        function Show(link) {
            var row = link.parentNode.parentNode;
         
            //Find label control in gridview
            var label = row.cells[0].getElementsByTagName("span")[0].innerHTML;
            alert(label);
            //Find textbox control in gridview
            var textbox = row.cells[1].getElementsByTagName("input")[0].value;
            alert(textbox);
            //Find dropdown control in gridview
            var dropdown = row.cells[2].getElementsByTagName("select")[0].value;
            alert(dropdown);
            //Find checkbox control in gridview
            var checkbox = row.cells[3].getElementsByTagName("input")[0].checked;
            alert(checkbox);
            //Find linkbutton control in gridview
            var linkbutton = row.cells[4].getElementsByTagName("a")[0].innerHTML;
            //or
            var linkbutton = link.innerHTML;
            alert(linkbutton);


            /// Second Way you can find the value of grid view contol

            //To Find Gridview or Other Data Controls
         
            var gridviewID = document.getElementById("GridView1").id;
            alert(gridviewID);

            var datalist = document.getElementById("GridView1");
            alert(datalist);

            //To Find Input Elements like Textbox
            var sp = datalist.getElementsByTagName("input")[0].value;
            alert(sp.toString());
            //To Find Elements Like Label
            var Label = datalist.getElementsByTagName("span")[0].innerHTML;
            alert(Label);
            //To Find Elements Like DropDownList
            var ddllist = datalist.getElementsByTagName("select")[0].value;
            alert(ddllist);

            var lnkbutton = datalist.getElementsByTagName("a")[0].innerHTML;
            alert(lnkbutton);

            var lnkbutton = datalist.getElementsByTagName("a")[0].innerHTML;
            alert(lnkbutton);
        }

        function ShowFooter(link) {

            //To Find Gridview or Other Data Controls Of Footer
            alert("RamVinay");
            var gridviewID = document.getElementById("GridView1").id;
            alert(gridviewID);

            var datalist = document.getElementById("GridView1");
            alert(datalist);

            //To Find Input Elements like Textbox
            var sp = datalist.FooterRow.getElementsById("GridView-9$ctl06$TextBox1")[0].value;
            alert(sp);
            //To Find Elements Like Label
            var Label = datalist.FooterRow.getElementsById("GridView-9$ctl06$Label2")[0].innerHTML;
            alert(Label);
            //To Find Elements Like DropDownList
            var ddllist = datalist.FooterRow.getElementsByTagName("GridView1$ctl06$DropDownList3")[0].value;
            alert(ddllist);

            //To Find Elements Like checkBox
            var chk = datalist.FooterRow.getElementsByTagName("GridView1$ctl06$CheckBox2")[0].innerHTML;
            alert(chk);
            var lnkbutton = datalist.FooterRow.getElementsByTagName("GridView1$ctl06$LinkButton2")[0].innerHTML;
            alert(lnkbutton);

            var lnkbutton = datalist.FooterRow.getElementsByTagName("GridView1$ctl06$LinkButton2")[0].innerHTML;
            alert(lnkbutton);
        }
</script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" ShowFooter="true" ShowHeader="false">
        <Columns>
        <asp:TemplateField>
        <ItemTemplate>
        <asp:Label ID="Label1" runat="server" Text='<% #Eval("Username")%>'></asp:Label>
        </ItemTemplate>
            <FooterTemplate>
               <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
            </FooterTemplate>
        </asp:TemplateField>
     
        <asp:TemplateField>
        <ItemTemplate>
            <asp:TextBox ID="TextBox2" runat="server" Text='<% #Eval("Username")%>'></asp:TextBox>
         </ItemTemplate>
            <FooterTemplate>
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            </FooterTemplate>
        </asp:TemplateField>
       
        <asp:TemplateField>
        <ItemTemplate>
            <asp:DropDownList ID="DropDownList2" runat="server">
            <asp:ListItem>1</asp:ListItem>
            <asp:ListItem>2</asp:ListItem>
            </asp:DropDownList>
        </ItemTemplate>
            <FooterTemplate>
            <asp:DropDownList ID="DropDownList3" runat="server">
            <asp:ListItem>1</asp:ListItem>
            <asp:ListItem>2</asp:ListItem>
            </asp:DropDownList>

            </FooterTemplate>
        </asp:TemplateField>
       
        <asp:TemplateField>
        <ItemTemplate>
            <asp:CheckBox ID="CheckBox1" runat="server" />
        </ItemTemplate>
            <FooterTemplate>
                 <asp:CheckBox ID="CheckBox2" runat="server" />
            </FooterTemplate>
        </asp:TemplateField>
       
        <asp:TemplateField>
        <ItemTemplate>
            <asp:LinkButton ID="LinkButton1" runat="server" OnClientClick="Show(this);" Text="Show"></asp:LinkButton>
        </ItemTemplate>
            <FooterTemplate>
           <asp:LinkButton ID="LinkButton2" runat="server" OnClientClick="ShowFooter(this);" Text="Submit"></asp:LinkButton>
            </FooterTemplate>

        </asp:TemplateField>
        </Columns>
        </asp:GridView>
    </div>
    </form>
</body>
</html>


Posted by at

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)