We usually write the javascript functions on aspx page.
If we want dynamic script then we can not write on aspx page because in many cases like script may require some data from database or any operation that can only be done from code behind.
In this case we can use RegisterStartupScript & RegisterClientScriptBlock functions to include Javascript on page from code behind.
They both are used for same purpose but the differences between them are mentioned below:-
1) The method RegisterStartupScript adds Javascript to the web form right before the ending 'form' tag whereas the method RegisterClientScriptBlock adds Javascript to the web form, right after the starting 'form' tag .
2) The method RegisterStartupScript is used when you want to assign any value or property or want to get the value or property from any element whereas in case of the method RegisterClientScriptBlock we will get an error as 'object undefined'.
3) The method RegisterStartupScript holds the code which will run as soon as the browser parses it but the method RegisterClientScriptBlock holds routines and libraries that the whole page uses.
Example 1:
protected void Page_Load(object sender, EventArgs e)
{
if(!ClientScript.IsClientScriptBlockRegistered("RegisterClientScriptBlock"))
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "RegisterClientScriptBlock", "document.write ('RegisterClientScriptBlock');", true);
if (!ClientScript.IsStartupScriptRegistered("StartupScriptRegistered"))
ClientScript.RegisterStartupScript(this.GetType(), "StartupScriptRegistered", "document.write('RegisterStartupScript');", true);
}
The parameters passed to these two methods are as follows:
1) type - The type of the ClientScript to register.
2) key - The key of the client script to register.
3) script - The client script literal to register.
4) addScriptTags - A Boolean value indicating whether to add script tags.
After running this page the output will be,
RegisterClientScriptBlock
Page Content
RegisterStartupScript
The script we have register using RegisterStartupScriptBlock renders first and the statement document.write writes "RegisterClientScriptBlock" to the page then we have the Page Content and finally the "StartupScriptRegistered".
If you see the view source,
Example 2:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
Untitled Page
</title></head>
<body>
<form name="form1" method="post" action="UseIComprer.aspx" id="form2">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNzgzNDMwNTMzZGT4JJog3qP93QeYemlckRLadGZVuw==" />
</div>
<script type="text/javascript"> document.write('RegisterClientScriptBlock');
</script>
<div>
<table>
<tr>
<td>
Page Content
</td>
</tr>
</table>
</div>
<script type="text/javascript"> document.write('StartupScriptRegistered');
</script>
</form>
</body>
</html>
RegisterStartupScript & RegisterClientScriptBlock, both will work fine in a normal Asp.Net page. But the same two will not work if we are using them in an Asp.Net AZAX Update Panel.
For Example:-
RegisterClientScriptBlock("alert", "<script language='javascript'>alert('Hello Smruti');</script>");
The above snippet of code works fine usually but the same code will not work if we are using it inside an UpdatePanel.
Solutions:-
To fix this we have to make use of ScriptManager as follows:
ScriptManager.RegisterClientScriptBlock(Page, Page.GetType(), Guid.NewGuid().ToString(), "alert('Hello')", true);
The parameters are as follows:
Page - (System.Web.UI.Page)The page object that is registering the client script block.
type - (System.Type)The type of client script block.
key - (System.Strig)A unique identifier for the script block.
script - (System.string)The script.
addScriptTags - (Syatem.Boolean)true to enclose the script block in <script> and </script> tags; otherwise false.
The ScriptManager control manages client script for AZAX-enabled Asp.Net web pages. By default, the ScriptManager control registers the script for the Microsoft Azax library with the page. This enables client script to use the type system extensions and to support features such as partial page rendering and Web-Service calls.
When a page contains one or more UpdatePanel controls, the ScriptManager control manages partial page rendering in the Browser.The control interacts with the page life cycle to update the parts of the page that are inside UpdatePanel controls.