Update DIV Browser Element everytime record is retrieved

A

a1jit

Regular
Joined
Aug 19, 2005
Messages
89
Hi Guys,

Really need some guide on this,

I heard that div elements are browser element and thus can be updated
at runtime when a current c# function is processed..

How do i accomplish this operation

I have code thats read from database..Sometimes processes 3000-5000 records which might take around 10minutes..

How do i update once a record is retrieved using div elements?


Meaning, lets say i have a form with 1 submit button, and 9 items to select..

Once user click submit button, which ever selected report will be processed.

So lets say i have 3000 data.. i want to some sort like update user in div elements regarding status (how many records already retrieved)

Really appreciate if someone could guide me here..
thank you very very much
 
Look into the javascript XmlHttpRequest object and the DOM javascript function getElementById.

The XmlHttpRequest object lets you asynchronously/synchronously send/receive text to the webserver where the page came from.

the getElementById returns the element that has a matching 'id' attribute.

This i merely simple guidance, not a complete/thorough explanation.
 
Hi Guys,

Thanks for the input, i decided to use the getelimentbyId to update the
div browser element but it doesnt work, its not updating the value for some reason..because i thought when i loops one time, it should update the
div element to be equal to the 'i' value, but thats not the case..Appreciate if someone could help me..Below is my code..



Code: 
public void why(object sender, System.EventArgs e)
{
int i;
for (i=0;i<300;i++)
	{
		Response.Write("<script language=javascript>;");
		Response.Write("function changeInnerText()");
		Response.Write("{if (document.getElementById && document.getElementById('hello') != null)");
		Response.Write("{document.getElementById('hello').innerText = i;}");
		Response.Write("return true;}");
		Response.Write("<//script>");
		Response.Flush();
	}
}


Code: 
	<body MS_POSITIONING="GridLayout">
		<form id="Form1" method="post" runat="server">
			<table border="1">
				<tr>
					<td>test1</td>
					<td>test</td>
				</tr>
				<tr>
					<td>test2</td>
					<td>
						<div id="hello" runat="server">This appears in front of the select in IE</div>
					</td>
				</tr>
				<asp:Button ID="test" Runat="server" OnClick="why"></asp:Button>
			</table>
		</form>
	</body>
 
Ok, I didn't look at the code before....

You realize you are hard-coding i into the javascript....

Which means that the innerText should be displaying "i" instead of the actual value.

Also, you realize that the loop you created is registering the same script 300 times.

You need to set the variable i in the javascript, and loop through it in the javascript...not in the code-behind.

function changeInnerText()
{
var i = 0;

var div = document.getElementById("hello");

for (; i < 300; i++)
{
div.innerHTML = i.toString();
}
}


Download Ajax.Net...it's relatively easy to use and will allow you to do what you want...make a call to a server-side function and send any params you want.
 
Looks like you're writing the same (not really) javascript function 300 times god knows here. javascript should be placed in the <head> or in a js block.

Code: 
function changeInnerText(elementId, value)
{
	var element = document.getElementById(elementId);
	if(element == null)
		return false;
	element.innerText = value;
	return true;
}
 
Hi Guys, thanks for the help..

I tried searching on AJAX, there was ample of examples on net..
But im still unable to fine one example that fits my needs..
If anyone has actually seen this example (Process at server, write to div element <updates>, then continue process, finish) , just a short one, hope you dont mind pasting the URL

Thank you very much
 
Back
Top