hi
I am using asp.net 2.0 version.and sql2005 database.
On my UpdateErrorLog.aspx page i have three dropdown.2nd dropdown is filled on basis of first and 3rd dropdown is filled on basis of second.On 3rd dropdown "onchange" event i have called javascript function"FetchDGContents()" defined in "AjaxScript.js" file using ajax.Ajax Request is send to page"AjaxServer.aspx" and i get the response from that page.Problem is coming when i am trying to use that response to display the data in gridview.Below i am writing the code for Ajax page,Design page and the javascript file.Error is mentioned in javascript file in FunctionFilltable() andCleartable().I have searched and found ,that the control name on page rendering is prefixed with its container name.So u can see in my code and in Javascript file the prefixed name is'ctl00_contentarea'.It is working fine for Dropdowns when i am accessing their values(below in code file u can see) but failed to do so for Gridview.Plz help me out.
Thanks is advance
Below Code ofUpdateErrorLog.aspx file-------
<%@dotnet.itags.org.PageLanguage="C#"MasterPageFile="~/Site.master"AutoEventWireup="true"CodeFile="UpdateErrorLog.aspx.cs"Inherits="UpdateErrorLog"Title="Untitled Page" %>
<asp:ContentContentPlaceHolderID="contentarea"Runat="Server">
<scriptsrc="js/filldropdown.js"type="text/javascript"></script>
<scriptsrc="js/AjaxScript.js"type="text/javascript"></script>//This is the file in which Prblem is coming
<divid="Headingtxt"class="containerheading">
Update Error Log</div>
<divid="formcontent"class="containerdiv">
<tablecellpadding="0"cellspacing="0"class="labelfont">
<tr>
<tdstyle="width: 65px; height: 30px">
<asp:LabelID="Label1"runat="server"Font-Names="Arial"Font-Size="X-Small"
Text="Project"></asp:Label></td>
<tdstyle="width: 100px; height: 30px">
<asp:DropDownListID="ProjectDropDown"runat="server"Width="179px">
</asp:DropDownList></td>
</tr>
<tr>
<tdstyle="width: 65px; height: 29px">
<asp:LabelID="Label2"runat="server"Font-Names="Arial"Font-Size="X-Small"
Text="WBS"></asp:Label></td>
<tdstyle="width: 100px; height: 29px">
<asp:DropDownListID="WBSDropDown"runat="server"Width="178px">
</asp:DropDownList></td>
</tr>
<tr>
<tdstyle="width: 65px; height: 34px;">
<asp:LabelID="Label3"runat="server"Font-Names="Arial"Font-Size="X-Small"
Text="Task"Width="32px"></asp:Label></td>
<tdstyle="width: 100px; height: 34px;">
<asp:DropDownListID="TaskDropDown"runat="server"Width="178px">
</asp:DropDownList></td>
</tr>
<tr>
<tdstyle="width: 65px; height: 28px">
</td>
<tdstyle="width: 100px; height: 28px"align="left">
<asp:ButtonID="BtnGo"runat="server"Text="Go"Width="47px"/></td>
</tr>
</table>
</div>
<divid="gridviewcontent"style="left: 175px; width: 515px; position: absolute; top: 265px;
height: 84px">
<asp:GridViewid="gverrorlog"style="Z-INDEX: 102; LEFT: -6px; POSITION: absolute; TOP: 1px"runat="server"
width="592px"CellPadding="3"GridLines="Both"BorderStyle="Inset"Font-Names="Arial"Font-Size="X-Small"Height="100px">
<HeaderStyleCssClass="colhead"BackColor="#FF8080"Font-Names="Arial"Font-Size="X-Small"></HeaderStyle>
<RowStyleBackColor="#FFC0C0"Font-Names="Arial"Font-Size="X-Small"/>
</asp:GridView>
<TABLEid="imgtbl"style="VISIBILITY:hidden"borderColor="#000000"cellSpacing="1"cellPadding="1"
width="96"bgColor="#ffffff"border="0">
<TR>
<TD></TD>
</TR>
</TABLE>
</div>
</asp:Content>
-------------------------------------------
Code forAjaxserver.aspx page----------
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
publicpartialclassAjaxServer : System.Web.UI.Page
{
#region Variables
SqlConnection con =newSqlConnection(ConfigurationManager.ConnectionStrings["ConString"].ConnectionString);
CommonClass objcommon =newCommonClass();
ErrorLogClass objerrlog=newErrorLogClass();
DataSet SelectLogDS =newDataSet();
string chString;
#endregion
protectedvoid Page_Load(object sender,EventArgs e)
{
if (!IsPostBack)
{
//getting querystring value from update errorlog page
string pid = Request.QueryString["PID"];
string wbsid = Request.QueryString["WBSID"];
string tid = Request.QueryString["TID"];if(Request.QueryString["FromUperrpage"]!=null)
{
Response.Clear();
SelectLogDS=objerrlog.SelectErrorLog(pid, wbsid, tid); //SelectErrorLog is the method defined in a class.
//If you want to test by showing the "Image for Process" for a long time, uncomment the below two lines and set the time
//Dim th As System.Threading.Thread
//th.Sleep(200)
chString = SelectLogDS.GetXml();
Response.Clear();
Response.ContentType ="text/xml";
Response.Write(chString);
Response.End();
}else
{
Response.Clear();
Response.End();
}
}
else
{
Response.Clear();
Response.End();
}
}
}
-----------------------------------
Code forAjaxScript.js ------------------------
// This creates a XMLRequest (ActiveXObject) to be sent to the server
var XmlReq;
function CreateXmlReq()
{
try
{
XmlReq =new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
XmlReq =new ActiveXObject("Microsoft.XMLHTTP");
}
catch(oc)
{
XmlReq =null;
}
}
if(!XmlReq &&typeof XMLHttpRequest !="undefined")
{
XmlReq =new XMLHttpRequest();
}
}
//This fucntion is to send the choice into the AJAX Server page for processing
function FetchDGContents()
{
//Starts displaying the Process Image table
imgtbl.style.visibility ='visible';var requestUrl ="AjaxServer.aspx?FromUperrpage=true&PID=" + document.getElementById("ctl00_contentarea_ProjectDropDown").value +"&WBSID=" + document.getElementById("ctl00_contentarea_WBSDropDown").value +"&TID=" + document.getElementById("ctl00_contentarea_TaskDropDown").value;
CreateXmlReq();
if(XmlReq)
{
XmlReq.onreadystatechange = HandleResponse;
XmlReq.open("GET", requestUrl,true);
XmlReq.send();
}
}
function HandleResponse()
{
if(XmlReq.readyState == 4)
{
if(XmlReq.status == 200)
{
// Before filling new contents into the DataGrid, clear the cotents by calling this function
//ClearTable();
// Fill the cleared Datagrid with new XML Reponse
FillTable(XmlReq.responseXML.documentElement);
// Hides the Process Image Table after displaying the contents
imgtbl.style.visibility ='hidden';
}
else
{
alert("There was a problem retrieving data from the server." );
}
}
}
//Fills the datagrid contents with the newly recieved Response content
function FillTable(serrorlog)
{
// Gets the response XML
var errlog = serrorlog.getElementsByTagName('NewDataSet');
// Gets the table type content present in the Response XML and gets the data into a variable tbl
var tbl = document.getElementById('ctl00_contentarea_gverrorlog').getElementsByTagName("tbody")[0];
//Getting Error on this Line Error is: "Microsoft JScript runtime error: 'document.getElementById(...)' is null or not an object"
// Iterate through the table and add HTML Rows & contents into it.
for(var i=0;i<errlog.context.childNodes(0).parentNode.childNodes.length;i++)
{
// Create a HTML Row
var row = document.createElement("TR");
// Set the style
row.setAttribute("className","text");row.setAttribute("bgColor","#ECECEC");
// Iterate thorugh the columns of each row
for(var j=0;j<errlog.context.childNodes(0).childNodes.length;j++)
{
// Create a HTML DataColumn
var cell = document.createElement("TD");
// Store the cotents we got from Response XML into the column
cell.innerHTML = errlog.context.childNodes(i).childNodes(j).text;
// Append the new column into the current row
row.appendChild(cell);
}
// Append the current row into the HTML Table(i.e DataGrid)
tbl.appendChild(row)
}
}
// Clearing the existing contents of the Datagrid
function ClearTable()
{
var tbl = document.getElementById('ctl00_contentarea_gverrorlog').getElementsByTagName("tbody")[0]; //Getting Error on this Line Error is: "Microsoft JScript runtime error: 'document.getElementById(...)' is null or not an object"
var row = tbl.rows.lengthfor (var i=1,j=1;j<row;i++,j++)
{
if (tbl.rows.length == 2){i = 1;}
tbl.deleteRow(i);
if (tbl.rows.length == i) {i = 0;}
}
}
-----------------------------------
u cant access objects of a page by id in separate javascript file
try palacing the code in the aspx page in <Script> tag or
u need to send object of that control to javascript function
Its also not working if we write the code in aspx page instead of placing in seperate js file.
I am still getting same error.
thanks
document.getElementById('ctl00_contentarea_gverrorlog').
instead try using
document.getElementById('<%=Controlid.clientid %>').
i think Controlid is contentarea_gverrorlog
can you please tell me what is clientid in the above code?
i have tried using document.getElementById('<%=Controlid.clientid %>'). but same error is coming.At runtime
it is showing this statement as "document.getElementById('System.Web.UI.WebControls.GridView')"
thanks
Client Id is id of that contol on client side like "ct100_gridview1"
use like this if u have a problem
in javascript which is in the same aspx page that has control
document.getElementById('<%= Id %>').
and Code behind like this
publicpartialclassDisabling_controls : System.Web.UI.Page
{
//Declare Page level global variable
Public String Id=String.Empty;
protectedvoid Page_Load(object sender,EventArgs e)
{
Id = GridView1.ClientID.ToString();
}
Your suggested code is working fine.but still error is coming on the same line i.e
----var tbl = document.getElementById('<%= Id %>').getElementsByTagName("tbody")[0];
if i remove "getElementsByTagName("tbody")[0]" i get the varaible "tbl" valuenull and If I don' t remove
i get the above said error.I am unable to track why error is coming because this code is working fine
in .Net 1.0 version using datagrid.No solution till now...
this is the function in which error is coming...
function FillTable(serrorlog)
{
// Gets the response XML
var errlog = serrorlog.getElementsByTagName('TestErrorLog');
// Gets the table type content present in the Response XML and gets the data into a variable tbl
var tbl = document.getElementById('<%= Id %>').getElementsByTagName("tbody")[0];
// Iterate through the table and add HTML Rows & contents into it.
for(var i=0;i<errlog.context.childNodes(0).parentNode.childNodes.length;i++)
{
// Create a HTML Row
var row = document.createElement("TR");
// Set the style
row.setAttribute("className","text");row.setAttribute("bgColor","#ECECEC");
// Iterate thorugh the columns of each row
for(var j=0;j<errlog.context.childNodes(0).childNodes.length;j++)
{
// Create a HTML DataColumn
var cell = document.createElement("TD");
// Store the cotents we got from Response XML into the column
cell.innerHTML = errlog.context.childNodes(i).childNodes(j).text;
// Append the new column into the current row
row.appendChild(cell);
}
// Append the current row into the HTML Table(i.e DataGrid)
tbl.appendChild(row)
}
}
see view source to check whether datagrid is rendered with
tbody
tags for which you are searching
I m using gridview .In starting i have mentioned that i m working in .Net 2005.
in .Net 2003 the same code is working fine for datagrid.But as in .Net2005 i m using master
pages and therefore control name on rendering gets changed(which is not so in .Net2003).
Same code work fine in .Net2005 if i dont use master pages in my project.
thanks
hi
i got it! where the problem is.Problem i am not showing data in gridview on pageload that's why
the error is coming, because gridview is not rendered onpageload and i am trying to access it...
But then next problem is How to Do paging,sorting,and to define userdefined tempaltes if we use AJAX.
If there is some solution realted to this please give me.I m working in .Net 2005(gridview control).
thanks a lot for all ur help.
That's why i have asked u to see ViewSource whether it is rendered or not
