RegisterStartupScript and RegisterClientScriptBlock methods

Link for all dot net and sql server video tutorial playlists

Link for slides, code samples and text version of the video

Healthy diet is very important both for the body and mind. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking our YouTube channel. Hope you can help.

1. RegisterStartupScript
2. RegisterClientScriptBlock

RegisterStartupScript method : This method places the JavaScript at the bottom of the page just before the closing [/form] element.

There are 2 overloaded versions of this method.
RegisterStartupScript(Type type, string key, string script)
RegisterStartupScript(Type type, string key, string script, bool addScriptTags)

Type Parameter : The type of the startup script to register. In most cases we use this.GetType(). When you register a client script, you cannot use the same key and type. They are considered duplicates. The Type parameter allows us to use the same key value across different types of controls.

Example: In this example, we are using the first overloaded version that has 3 parameters. In this example we are including the the script tags in the script block that we want to register.

ASPX
[asp:TextBox ID="TextBox1" runat="server" onkeyup="getCharacterCount()" ]
[/asp:TextBox]
[asp:Label ID="Label1" runat="server"][/asp:Label]

Code-Behind
protected void Page_Load(object sender, EventArgs e)
{
ClientScript.RegisterStartupScript(this.GetType(), "clientScript",
"[script type=\"text/javascript\" language=\"javascript\"]" +
}

If you want the script tags to be generated, instead of hardcoding them in the script block, you can use the second overloaded version that has 4 parameters.

protected void Page_Load(object sender, EventArgs e)
{
ClientScript.RegisterStartupScript(this.GetType(), "clientScript",
}

RegisterClientScriptBlock method : This method is very similar to RegisterStartupScript method, except that this method places JavaScript after the opening [form] element in the page but before the HTML elements are loaded.

protected void Page_Load(object sender, EventArgs e)
{
ClientScript.RegisterClientScriptBlock(this.GetType(), "clientScript",
"[script type=\"text/javascript\" language=\"javascript\"]" +
}

What is the difference between RegisterStartupScript and RegisterClientScriptBlock. When to use one over the other
The main difference is that, RegisterStartupScript method places the script at the bottom of the page (after all the elements in the page) just before the closing [/form] element. The advantage of this is that by the time the script executes, all the HTML elements are already loaded. This means the script can reference and HTML element without NULL reference errors.

The following example works because the script is placed on the page just befor the closing [/form] element. So the script finds the referenced element with id=Label1

ASPX : [asp:Label ID="Label1" runat="server"][/asp:Label]

Code-Behind
protected void Page_Load(object sender, EventArgs e)
{
ClientScript.RegisterStartupScript(this.GetType(), "clientScript",
}

However, if you use RegisterClientScriptBlock method you will get a null reference error. This is because RegisterClientScriptBlock method places the script before the HTML elements on the page, so by the time the script is executed the HTML elements are not loaded and hence we get a NULL reference error.

protected void Page_Load(object sender, EventArgs e)
{
ClientScript.RegisterClientScriptBlock(this.GetType(), "clientScript",
}

In summary here are the differences
1. RegisterStartupScript method places JavaScript just before the closing [/form] element i.e after all the HTML elements. RegisterClientScriptBlock method places JavaScript after opening [form] element i.e before all the HTML elements.

2. Use RegisterClientScriptBlock() method for scripts encapsulated in functions and that you don't need to run on page load. RegisterStartupScript() method can be used for any script, even if it's not inside a function. Generally RegisterStartupScript() method is used for scripts that must run on page load.

[ga]

Venkat, you are the best I have ever seenNo one has explained this subject like you, God bless you

[JediPhantom]

I really look forward to your videos, especially this series..I learn so much..thanks

[saibhaskerraju]

Great Work Mr.Venkat ... Please add more videos on Javascript and ASP.NET

[niravs]

Venkat.. I started following your posts recently and I must say you are doing awesome job..
i got the same question what Venu had asked.. I can do the same job by writing my own javascript in either directly aspx page or in a separate js file. in which scenario, one is recommended over another? Please provide some examples.

[venumehta]

Thank you so much for this tutorial - very helpful!

Had another question related to it - As I am new to javascript, I am always looking for best practices. Just curious as to when one would use client.RegisterStartupScript methods as opposed to adding this javascript directly from your aspx files or .js files?

Many thanks again for these wonderful tutorials!

-Tulsi

[jayflaggs]

Is it possible to call a javascript library rather than writing the javascript inline?

[faizamushtaq]

Can you please check my code it showing an error "ClientScript is not in context".
string message = "Your details have been saved successfully.";
string script = "window.onload = function(){ alert('";
script += message;
script += "')};";
ClientScript.RegisterStartupScript(this.GetType(), "SuccessMessage", script, true);
return RedirectToAction("index");

[colinmyers-boston]

This is how you call a javascript function from a partial reload:
ScriptManager.RegisterStartupScript(Page, typeof(Page), "somekey", "myFunciton();", true);