Introduction
JavaScript is a scripting language most often used for client-side web development. It is a dynamic, weakly typed, prototype-based language with first-class functions.
Although best known for its use in websites (as client-side JavaScript), JavaScript is also used to enable scripting access to objects embedded in other applications.
ASP.NET provides a new paradigm for developing Web-based applications. This includes a set of server-based controls that are analogous to HTML form elements such as text boxes, buttons, and so forth. The problem with these controls is the need to call the server. JavaScript provides an alternative for many tasks that negates the need to go to the server. Let's take a closer look at combining the power of JavaScript with ASP.NET.
Main
I want to catch a click event on a web form using image button and submit the event to another process in this case here it opens a new page. The script can be placed on body tag of any site that need to open this window whether it is a asp.net, php, java, or any language.
Now the button in here is an image button. This is rendered by the server as an input type of 'image' which does not have a click method so we can use target=_self onclick syntax=’javascript:ClickRequest()’ to the javascript.
The script now can be used to create image buttons that behave like standard browser buttons. Let me show complete script for a button created.
ButtonScript.aspx.cs C# syntax:
// this syntax return current url without butttonscript.aspx
CurrentURL = Request.Url.OriginalString.Remove
(Request.Url.OriginalString.IndexOf("ButtonScript.aspx"));
//this syntax create a javascript button image, images will be retrieved from
//images/imagename.gif
sImg = "<A onclick=javascript:ClickRequest() href="javascript:;" target=_self>
<IMG id=TestButtonImg height=54 src='" + CurrentURL + "images/imagename.gif' width=150 border=0></A>”;
//this syntax is a variable of new opened window when the button is clicked
sURL = CurrentURL + "openedwindow.aspx?id=" + Request.QueryString["id"].Trim()
+ "&ref=" + Server.UrlEncode(referer);
ButtonScript.aspx front page syntax:
<%@ Page Language="C#" enabletheming="false" AutoEventWireup="true"
CodeFile="ButtonScript.aspx.cs" Inherits="ButtonScript" %>
<HEAD VISIBLE="false" runat="server">
function ClickRequest()
{
NewWindow = window.open('<%=sURL%>', 'Window
Header', "toolbar=0,location=0,status=0,menubar=0,scrollbars=0,resizable=1,
width=800,height=600,top=0,left=0);
NewWindow.focus();
}
document.write("<%=sImg%>");
After you create ButtonScript .aspx page, we can insert below javascript to any page you want to show this image button:
The final step is to replace http://www.siteurl.com/ with your current ButtonScript.aspx url and replace id=1 with parameters that you need to process in openedwindow.aspx.
Conclusion
The great thing about a JavaScript button is that it renders as an tag, which means it can be easily styled and embedded on any part of web page body. The downside is the LinkButton doesn’t work if JavaScript isn’t available.
References
Include all the useful links or references that can help users learn about your tutorial
- JavaScript Button
- Javascript Button Object
Other Related and Popular Articles :
Author Profile : Hans Candra
How would you rate the quality of this content?
Poor
Excellent
Comments
Leave New Comments
Article Content copyright by
Hans Candra
Everything else Copyright © by
WorldofASP.NET
2008