I have the following code which should update a label to say "please wait..", then run a function, and then update the label again to say it has pleted:

<asp:Button ID="Button1" runat="server" Text="Upload"
                    onclientclick="document.getElementById('errorMessage').innerText='Please Wait...';" 
                    onclick="Button1_Click"  />

This works fine in IE, but not in Firefox.

When I run it in Firefox the label does not change until the process pletes.

Is there a way to force the javascript to update the page before running the C# function?

I have the following code which should update a label to say "please wait..", then run a function, and then update the label again to say it has pleted:

<asp:Button ID="Button1" runat="server" Text="Upload"
                    onclientclick="document.getElementById('errorMessage').innerText='Please Wait...';" 
                    onclick="Button1_Click"  />

This works fine in IE, but not in Firefox.

When I run it in Firefox the label does not change until the process pletes.

Is there a way to force the javascript to update the page before running the C# function?

• c#
• asp
• javascript
• firefox
• internet-explorer

Share Improve this question Follow asked Jan 7, 2010 at 18:01 BenBen 4,31999 gold badges6969 silver badges105105 bronze badges

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 5

The innerText property is a proprietary Internet Explorer feature. In Firefox and other DOM patible browsers, use textContent(link).

The following code will test to see which property is supported by the browser and use the appropriate one:

var node = document.getElementById('errorMessage');
var errorMessage = 'Please Wait...';
if (typeof node.innerText !== 'undefined')
  node.innerText = errorMessage;
else
  node.textContent = errorMessage;

If your site will involve a lot of JavaScript, I strongly remend using a 3rd-party library such as jQuery that takes care of these browser inpatibilities for you.

Why don't you try:

document.getElementById('errorMessage').innerHTML = 'Please Wait...'

And to avoid putting different code in different browsers, i'd suggest you to use jQuery.

$('#errorMessage').html('Please Wait...');

onclientclick and innerText are not standard DOM attributes. Use onclick and textContent or innerHTML. Or better yet, use jQuery:

$('#Button1').click(function() {
    $('#errorMessage').text('Please Wait...');
});

If you want to do it with standard DOM methods rather the non-standard (and subtly different) innerText and textContent properties:

var el = document.getElementById('errorMessage');
while (el.firstChild) {
    el.removeChild(el.firstChild);
}
el.appendChild( document.createTextNode('Please Wait...') );

Obviously this is quite verbose, and is likely to be slower than the innerHTML alternative.

Unfortunately, the behavior of JavaScript does very in some details across different browsers. Here's my suggestion: use jQuery.

The experts at jQuery have done tremendous work to smooth over these differences, and many other pitfalls besides.