Saturday, 28 February 2015

Call JavaScript Function from C# Code Behind in ASP.NET

In this article, I am going to write C# and JavaScript code sample to call javascript function from ASP.NET code behind. We can use ScriptManager to register and call javascript functions from server side. The ClientScriptManager class has two methods (RegisterStartupScript and RegisterClientScriptBlock) to register and call javascript functions from C# code behind.

Summary:


Call JavaScript Function from C# Code using RegisterStartupScript:

You can call javascript function from server side using ScriptManager's RegisterStartupScript method. Here, I have written an example to find web server time in code behind and call javascript function by passing date time as input parameter.

Default.aspx:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Call JavaScript function from c# code behind using RegisterStartupScript</title>
    <script type="text/javascript">
        function SetCurrentTime(dateTime) {
            document.getElementById("currentDate").value = dateTime;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Button ID="Getdate" runat="server" OnClick="Getdate_Click" Text="Get DateTime" />
    <input type="text" id="currentDate" />
    </div>
    </form>
</body>
</html>

Default.aspx.cs:
public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }

    protected void Getdate_Click(object sender, EventArgs e)
    {            
        ScriptManager.RegisterStartupScript(
                this.Page, this.GetType(),
            "SetCurrentTime",
                string.Format("<script type='text/javascript'>SetCurrentTime('{0}');</script>",DateTime.Now.ToString()),
                false);
    }
}

Call JavaScript Function from C# Code using RegisterClientScriptBlock:

You can also call javascript function from server side using ScriptManager's RegisterClientScriptBlock method. But you can not find control while using RegisterClientScriptBlock since it inserts scripts after the form opening tag (<form>). Here, I have written an example to find web server time in code behind and display it in alert box.

Default.aspx:
--
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Call JavaScript function from c# code behind using RegisterClientScriptBlock</title>
    <script type="text/javascript">
        function SetCurrentTime(dateTime) {
            alert(dateTime);
            // Control can be found while using RegisterClientScriptBlock 
            // since it inserts scripts after the form opening tag (<form>)  
            //document.getElementById("currentDate").value = dateTime;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Button ID="Getdate" runat="server" OnClick="Getdate_Click" Text="Get DateTime" />
    <input type="text" id="currentDate" />
    </div>
    </form>
</body>
</html>

Default.aspx.cs:
public partial class WebForm1 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }

    protected void Getdate_Click(object sender, EventArgs e)
    {
        ScriptManager.RegisterClientScriptBlock(
                this.Page, this.GetType(),
            "SetCurrentTime",
                string.Format("<script type='text/javascript'>SetCurrentTime('{0}');</script>", DateTime.Now.ToString()),
                false);
    }
}

Advertisements
Advertisements

No comments:

Post a Comment