Saturday, March 5, 2011

Find Textbox and value Inside the Grid view using Javascript

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
     <script language="javascript" type="text/javascript">
 

function read()
{
var cell;
             var grid = document.getElementById("<%= GridView1.ClientID %>");

            if (grid.rows.length > 0)
            {
            
                for (i=1; i<grid.rows.length; i++)
                {
                
                    cell = grid.rows[i].cells[5];
                   
                    alert(i);
                    for (j=0; j<cell.childNodes.length; j++)
                    {          
                                   
                        if (cell.childNodes[j].type =="text")
                        {
                    
                             alert(cell.childNodes[0].value);
                             alert(cell.childNodes[0].id);
                              alert(cell.childNodes[0].clientid);
          eventSrcID=(event.srcElement)?event.srcElement.id:'undefined';
eventtype=event.type;
status=eventSrcID+' has received a '+eventtype+' event.';
alert(status);

                          // var obj=source;
                          // alert(obj.id);
                          //alert(evnt);
                          //var ob=evnt;
                        
                          // window.captureEvents(evnt.change);
                          //  alert(evnt.target.value);
                          // alert(evnt.type);
                          // if(evnt.type == "change"){
            //alert("a");
            //alert(evnt.target.id);
           
           
           
        }


                            
                        }
                    }
                }
            }
       
 </script>
   
</head>
<body>
    <form id="form1" runat="server">
    <div>
   
        <asp:TextBox ID="TextBox2" runat="server" ontextchanged="TextBox2_TextChanged"
            AutoPostBack="True"
            style="top: 98px; left: 23px; position: absolute; height: 22px; width: 128px"></asp:TextBox>
   
        <asp:Button ID="Button1" runat="server" onclick="Button1_Click"
            style="top: 174px; left: 44px; position: absolute; height: 26px; width: 56px"
            Text="Button" />
   
        <asp:SqlDataSource ID="SqlDataSource1" runat="server"
            ConnectionString="<%$ ConnectionStrings:masterConnectionString %>"
            SelectCommand="SELECT * FROM [emp1]"></asp:SqlDataSource>
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
            DataKeyNames="empid" DataSourceID="SqlDataSource1"
            style="z-index: 1; left: 233px; top: 142px; position: absolute; height: 133px; width: 187px">
            <Columns>
                <asp:BoundField DataField="empid" HeaderText="empid" ReadOnly="True"
                    SortExpression="empid" />
                <asp:BoundField DataField="code" HeaderText="code" SortExpression="code" />
                <asp:BoundField DataField="phone" HeaderText="phone" SortExpression="phone" />
                <asp:BoundField DataField="country" HeaderText="country"
                    SortExpression="country" />
                <asp:BoundField DataField="CITY" HeaderText="CITY" SortExpression="CITY" />
                <asp:TemplateField>
                <ItemTemplate>
                    <asp:TextBox ID="TextBox1" onchange="read()" runat="server"></asp:TextBox></ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>
   
    </div>
    </form>
</body>
</html>

2 comments:

  1. I have two fields in the GridView
    1. Notification Date
    2. Effective Date

    When user entered/change date in the Notification date, I would like to add 10 addtional days in the Notification date value and auto populate in the effective date every time when user change the notification date. Please advise:

    ReplyDelete
  2. I am trying to put the asp.net code but it's the accepting here: I am using: CalendarExtender ID which display the date in the Gridview TextBox in ASP.Net. I would to write Javascript to extract the Notification Date and Auto populate in the Effective Date

    ReplyDelete