Click here to Skip to main content
15,885,032 members
Articles / Web Development / ASP.NET
Article

Emit Client-Side Script

Rate me:
Please Sign up or sign in to vote.
2.53/5 (11 votes)
21 Dec 20041 min read 50.6K   18   3
The article describes how can we use the Page methods RegisterClientScriptBlock/RegisterStartupScript to emit client-side JavaScript to popup a window.

Introduction

A very simple method to popup a window on button click is, write the JavaScript code at the client side. Following code demonstrates this method.

ASP.NET
<form>
    <input type="button" value="Click Me!" onClick="window.open('hello.html')">
</form>

The disadvantages of this method are:

  1. Code is visible at client side.
  2. Code and HTML are not separate. Thus maintenance is tedious.

With ASP.NET these disadvantages disappear. Let's take a look how this can be done with ASP.NET.

The popup html page

The first page that we will create is the 'hello.html' page. This is the page that will be popped up in the new window.

HTML
<html>
  <body>
   <h1>Hello, World!</h1>
  </body>
</html>

The aspx Page

Let us create an ASP.NET Web Form with a single button.

ASP.NET
<form runat="server">
  <asp:button id="button1" onclick="button1_click" 
             runat="server" Text="Click Me!"></asp:button>
</form>

Now we will add the C# script code to handle our button click event. Off course, you can create this with the code-behind facility.

C#
<script language="C#" runat="server">
  string buildScript(string id, string output_page)
  {
      string myScript = "\n";
   
    myScript += "<script language="'javascript'" id='" + id + "'>\n";
       myScript += "window.open('" + output_page + "');\n";
       myScript += "</" + "script>\n";
   
       return myScript;
  }
  void button1_click(object sender, EventArgs e)
  {
       string script_id = "popup";
       string myScript = buildScript(script_id, "hello.html");
       if(!IsStartupScriptRegistered(script_id))
       {
             RegisterStartupScript(script_id,myScript);
       }
  }
</script>
ASP.NET
<form runat="server">
    <asp:button id="button1" onclick="button1_click" 
         runat="server" Text="Click Me!"></asp:button>
</form>

Let us call this page 'popupexample.aspx'.

The entire thing explained!

Our function buildScript builds the script that will be emitted to the client side. button1_click handles the button.OnClick event. The Page.RegisterStartupScript and Page.RegisterClientScriptBlock are used to emit the script to the client side. With Page.RegisterClientScriptBlock, the client-side script is emitted just after the opening tag of the Page object's <form runat="server"> element. With Page.RegisterStartupScript, the client-side script is emitted just before the closing tag of the Page object's <form runat="server"> element.

Page.IsClientScriptBlockRegistered: Call this method before calling Page.RegisterClientScriptBlock/Page.RegisterStartupScript to avoid unnecessarily assembling the client-side script. This is particularly important if the script requires a large amount of server resources to create.

References

MSDN.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


Written By
Web Developer
India India
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
Generalreal world problem Pin
JVMFX1-Apr-05 7:30
JVMFX1-Apr-05 7:30 
QuestionHuh?? Pin
ConradC23-Dec-04 14:28
ConradC23-Dec-04 14:28 
AnswerRe: Huh?? Pin
Jitesh Patil23-Dec-04 16:18
Jitesh Patil23-Dec-04 16:18 
Conrad,
Offcourse the javascript will be visible.
I agree to that.

But why would you use such a method?
Suppose you wanted to create a dynamic menubar on your page. And on the click of every button, you wanted to do something different. For one of those you might want to Popup a window.

The whole funda of the excercise was to use the Register the client side scripts.

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.