Click here to Skip to main content
15,116,516 members
Please Sign up or sign in to vote.
5.00/5 (1 vote)
See more:
I am using $(document).ready function to add custom radio buttons on the page. Now I had to add a confirm dialog on the page depending on some condition. I had to add RegisterStartupScript in code behind . But Its popping up at the beginning before $(document).ready function is not firing. How to make it fire before the confirm dialog shows up. Thanks in advance.
Posted

1 solution

In ASP.NET web apps, most of the times we would need to call JavaScript functions in page_load event of code behind, for various valid reasons. In such scenarios, we simply use .NET’s Register Script methods for emitting JavaScript code, which is absolutely fine.

If you are using jQuery, you would write the logical flow of events to be executed in $(document).ready() function. However, if you are using Register script methods with jQuery, the output will not be as expected. I have faced this problem yesterday and want to share the reason and simple solution.

.NET framework provides two methods for emitting JavaScript to the client. They are:

RegisterClientScriptBlock (Client-side script is emitted just after the <form runat=”server”> tag)
RegisterStartupScript (Client-side script is emitted just before the </form> tag)
Note: These methods are now moved to ClientScriptManager class from Page class.

Okay. Now that the difference between the two is clear, let us go forward. Consider the below simple JS code:

C#
function fnTestScript(msg) {
    console.log(msg);
}

$(document).ready(function() {
    fnTestScript('This is from document.ready');
});




We am defining a method fnTestScript(parameter) and calling it in jQuery’s ready() function. Now, in page_load event of server, let us call this method using Register script methods.

VB
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
       'Using "RegisterClientScriptBlock" method to emit JS code.
       Dim strScript As New StringBuilder
       strScript.Append("<script language='javascript'>")
       strScript.Append("fnTestScript('This is from RegisterClientScriptBlock');")
       strScript.Append("</script>")
       ClientScript.RegisterClientScriptBlock(Me.GetType(), "TestScript", strScript.ToString())

       'Using "RegisterStartupScript" method to emit JS code.
       Dim strScript2 As New StringBuilder
       strScript2.Append("<script language='javascript'>")
       strScript2.Append("fnTestScript('This is from RegisterStartupScript');")
       strScript2.Append("</script>")
       ClientScript.RegisterStartupScript(Me.GetType(), "TestScript", strScript2.ToString())
   End Sub


The reason is simple. .NET is injecting the script inline, into the DOM. So its functions are called before $(document).ready(), which fires after DOM is loaded. This means, your logical sequence of JavaScript calls has gone for a toss!

The solution is even more simple. Just add $(document).ready() in your function definition:

C#
function fnTestScript(msg) {
    $(document).ready(function() {
        console.log(msg);
    });
}
   
v2
Comments
Prasad_Kulkarni 13-Jul-12 1:42am
   
Well answered Abhinav. +5!
abhinavvijay 13-Jul-12 12:32pm
   
thanks

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900