Articles → .NET → Call JavaScript from code behind in asp.net

Call JavaScript from code behind in asp.net

In this article I will explain how to call JavaScript from code behind in asp.net. This topic contains following sections

   1. Software requirement

   2. Prerequisite knowledge

   3. Steps of execution

   4. Create a new project

   5. Add controls to the page

   6. Add JavaScript code in code behind

   7. Output

Software requirement

Before you start reading this tutorial you should make sure that Visual studio 2005(or above) is installed on your machine.

Prerequisite knowledge

Before you go ahead, it is required that you should know

1. How to create a project using visual studio?

2. Basic knowledge about basic controls like button etc and their events.

Steps of execution

In this tutorial I will execute certain steps for the demonstration of calling JavaScript from code behind in asp.net. These steps are

   1. Create a new project

   2. Add controls to the page

   3. Add JavaScript code in code behind

Let us execute each step

Create a new project

First of all create a new project. See the screen shot below for project structure

Picture showing the project structure of asp.net

Click to Enlarge

Add controls to the page

Add a button on the screen. On click of this button we will call the JavaScript code. See the screen shot below for page UI.

Picture showing the web page with the button control

Click to Enlarge

Add JavaScript code in code behind

Use the following code in code behind

using System;

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

}
	protected void Button1_Click(object sender, EventArgs e) {
		this.ClientScript.RegisterStartupScript(this.GetType(), "ALERTMESSAGE", "alert('Button clicked')", true);
	}
}

On button click we are calling a method RegisterStartupScript. This method adds the JavaScript code before the end of form tag. This method takes 4 parameters

   1. Type – Type of start up script to register

   2. Key – This is the key of the script to register

   3. Script – JavaScript which you want to register.

   4. AddScripttags – It is a Boolean value (when set to true) ensures that script is added between the script tags.

Output

Picture showing the alert message when user clicks on the button

Click to Enlarge

If you look at the rendered HTML you can see the inserted JavaScript

Picture showing the rendered script in view code

Click to Enlarge

Posted By -	Karan Gupta

Posted On -	Thursday, May 2, 2013

Query/Feedback

Your Email Id

Subject

Query/Feedback	Characters remaining 250