Often there is a need to generate JavaScript instructions in server-side ASP.NET code and send them to the client for execution. But what if you need to run that server-generated JavaScript code within client Page Load event (here I am talking about ASP.NET AJAX pageLoad(sender, args) event, but it applies to generic body.onLoad event as well).

Let’s say you have the following JavaScript code:

var g_oDiv;

function pageLoad(sender, args) {
    g_oDiv = $get('xdivControl')
}

In this code a global variable is declared and on Page Load event a reference to a DIV control is assigned to it. Now lets say on server side you perform some calculations or read data from the database and then want to assign that data to innerHTML property of that DIV:

Dim sValue as string
'
'Some code to assign sValue some data
'
RunJavascript(Me, "g_oDiv.innerHTML = '" &  sValue & "';")

Here I am using function to run JavaScript described in this post, but in this context it’s pretty much identical to ClientScript.RegisterStartupScript.

The problem with this approach is if server-generated code executed on client before the pageLoad event you will get an error, because g_oDiv variable is not initialized by that time. One way to try to delay execution is using setTimeout function:

RunJavascript(Me, "setTimeout(""g_oDiv.innerHTML = '" &  sValue & "'"",10);")

This will delay execution of server-generated JavaScript code for 10 milliseconds giving pageLoad event a chance to run first. But this approach can produce inconsistent results.

A better approach is to generate full JavaScript function on server. This way the generated code doesn’t get executed at all unless this function is called. And we can place the call in client pageLoad event.

Let’s modify our server side code:

Dim sbStartupFunction As New StringBuilder("function startup() {")
sbStartupFunction.AppendFormat("g_oDiv.innerHTML = {0}", sValue)
sbStartupFunction.Append("}") 
RunJavascript(Me, sbStartupFunction.ToString)

This code uses StringBuilder to create a full JavaScript function to be sent to the client. The only thing left is to modify pageLoad event to call this function:

function pageLoad(sender, args) {
    g_oDiv = $get('xdivMessageDiv');
    if (typeof(startup) != 'undefined') startup()
}