Introduction
Although Jscript has mostly been used to develop client-side scripts, it's
increasingly also being used for server-side programming. Since JScript supports
object-oriented programming and exception handling, it is a candidate for
server-side development.
We all know that ASP+ pages can be developed using any of the .NET
Runtime-compliant languages like C# (pronounced C-Sharp), Visual Basic (VB)
.NET, JScript.NET, etc. There are plenty of sample programs that demonstrate
writing ASP+ pages using C# and VB. Surprisingly, there are not many examples
that demonstrate an ASP+ page written in JScript.NET. Even the .NET preview SDK
documentation talks about the older version of JScript, 5.5.
The lack of documentation and sample programs are the main reasons why I
started to explore developing ASP+ pages using JScript.NET. I started writing
simple ASP+ pages using JScript.NET, and they seem to work just fine. Once you
understand the syntax of the new features in JScript.NET, it is very easy to
write anything from a Web form to Web service using JScript.NET. In this article
we will look at how to do the following:
- 1. Write a simple ASP+ page with server-side event handlers.
- 2. Perform the programmatic creation of an ASP+ page.
Prerequisites
To run this article's sample code, you need to install the following on your
machine:
- Windows 2000 (Professional/Server)
- .NET Technology Preview SDK
Introduction to JScript.NET
JScript.NET is an evolution of JScript and has new features that facilitate
developing robust server-side applications. Before studying how to code ASP+
pages, let's look at some of the important features in JScript.NET
- Compiled language
- Data-type inferencing
- Better object-orientation support
Compiled Language
JScript.NET is a truly compiled language compared to its predecessor, JScript
5.5, which is interpreted. The compilation of the code improves the performance
of your applications. Just like other .NET languages, the source code is
compiled to the intermediate language (IL) and then is executed by the .NET
Runtime.
Data-Type Inferencing
JScript.NET compiler has the type-inferencing ability that is used to
determine the type of the variable. The only data type that was supported in
JScript 5.5 was Object. Object is a super type that can hold values of any data
type.
Be certain to use the same variable to store data of different data types.
For example, if you use a variable to store strings, do not use it to store
floating-point numbers. Remember that JScript.NET can't infer types of global
variables. Always declare local variables explicitly using "var."
The new addition to JScript.NET is type annotations. Type annotations help
the compiler detect type mismatch errors. For example, to declare an integer
variable, use the following syntax:
var iVar : int;
JScript supports the data types int, float, double, Boolean, number, string,
long, object, and array. You can specify data types for local variables, member
variables of a class, and parameters of functions using the type-annotation
syntax.
Better Object-Orientation Support
Unlike in JScript 5.5, where we used to rely on a function that acts like a
class, you can declare classes explicitly in JScript.NET using the keyword
"class" as follows:
class MyClass
{
// member variables
// methods
};
JScript.NET supports inheritance. As a result, you can build new classes by
inheriting from existing classes. The following example shows how to inherit a
class from an existing class:
class DerivedClass extends BaseClass
{
// member variables
// methods
};
A Simple ASP+ Page
Developing an ASP+ using JScript.NET is almost similar to developing a page
using any .NET language, except for the changes in language syntax. Continuing
the tradition of programming languages, let us write an ASP+ page that will
display a welcome message. The source code is given below:
<%@ Page Language="JScript" %>
<html>
<head>
<script language="JScript" runat="server" >
function Page_Load(o : Object, e : EventArgs )
{
lbl.Text = "Click the Button below to see a welcome message...";
}
function Show(o : Object, e : EventArgs)
{
lblMessage.Text = "Welcome to ASP+";
}
</script>
</head>
<body style="font-family:Verdana; font-size:10pt;
font-color:blue;">
<center>
<H3>Demonstration of an ASP+ page written in
JScript.NET</H3>
<form method="post" action="JHelloWorld.aspx" runat="server">
<p><asp:Label id=lbl Runat="server"/>
<p><asp:Button id=cmdClick Runat="server" Text="Hello
World" onClick="Show" />
<p><asp:Label id=lblMessage Runat="server"/>
</form>
</center>
</body>
</html>
The first line of the code is a Page Directive, which indicates the page
compiler that the page is written using JScript. In ASP+ pages, you can neatly
compartmentalize your code into the server-side event handlers. The execution of
the page is not linear, but event driven.
The entire ASP+ page is just a .NET class derived from the .NET framework
"Page" class. The prefix "Page_" denotes that they are event handlers of the
Page object. Two events that are worth learning are Page_Load and Page_Unload.
The Page_Load event fires before rendering the page to the browser. You can
write the initialization code in this event handler. The Page_Unload event fires
after the page is rendered. This is an ideal place to write the clean-up code.
An ASP+ page is built using the HTML and/or Web controls. Web controls are
server-side controls that will generate HTML back to the browser. The object
model of the Web control is consistent and its properties need not necessarily
map with the HTML attributes. Usually, the programming logic of any ASP+ page
resides in the event handlers of the control events.
The event handlers are tied up to the control events in the declaration of
the controls. In the example shown above, the event handler "Show()" is
associated with the click event of the button in its declaration tag.
<p><asp:Button id=cmdClick Runat="server" Text="Hello World"
onClick="Show" />
Programmatic Creation of an ASP+ Page
Again, a page consists of HTML and Web controls with their event handlers.
The HTML and Web controls can either be declared using the tags during the page
design or created dynamically on the fly. For every control, there is a
corresponding .NET class you can use to create and manipulate. There are lots of
HTML tags and it's impossible to provide one HTML control for each tag. So, ASP+
has a control named HtmlGenericControl that is the super control you can use for
any of the HTML tags that do not have a corresponding HTML Control class.
You can construct a control, initialize its properties, and then add it to
another control or the Page object. The page is a container that has all these
controls stored in a hierarchy. The following code demonstrates the creation of
an ASP+ page.
<%@ Page language="JScript" %>
<script language="JScript" runat="server">
function Page_Load(sender : Object , e : EventArgs )
{
var row : int = 0;
// Construct HTML, BODY, H3 Elements and add them to the page
var html : HtmlGenericControl = new HtmlGenericControl("html");
var body : HtmlGenericControl = new HtmlGenericControl("body");
this.Controls.Add(html);
html.Controls.Add(body);
var h3 : HtmlGenericControl = new HtmlGenericControl ("h3");
h3.InnerText = "Dynamically Created ASP+ Page using JScript.NET";
body.Controls.Add(h3);
// Construct the Form element
var TableForm : HtmlForm = new HtmlForm();
TableForm.Name = "TableForm";
var t : HtmlTable = new HtmlTable();
t.CellPadding = 5;
t.CellSpacing = 0;
t.Border = 1;
t.BorderColor = "black";
var i : int = 0;
var j : int = 0;
for(i = 0;i<10;i++)
{
var r : HtmlTableRow = new HtmlTableRow();
//change the background color for alternating rows
if(i%2 == 0)
r.BgColor = "LightSkyBlue";
for(j = 0;j<4;j++)
{
var c : HtmlTableCell = new HtmlTableCell();
c.Controls.Add(new LiteralControl("row " +
i.toString() + ", " +
j.toString()));
r.Cells.Add(c);
}
t.Rows.Add(r);
}
TableForm.Controls.Add(t);
body.Controls.Add(TableForm);
}
</script>
The first two lines create an HtmlGenericControl for the tags HTML and Body.
The HTML control is added to the Page object. Notice the use of the keyword
"this." The keyword "this" represents the object for which the handler is
written. In this case, "this" refers to the Page object.
The HtmlGenericControl that represents the Body tag is added to the
HtmlGenericControl for HTML tag. The Form element that acts as the container for
the other controls in the page is then created. The Html Table with the rows and
columns is created and added to the Form control. Finally the Form itself is
added to the Body.
The items are added in this order because the order determines the placement
of opening and closing tags. For example, if we added both the HTML and Body
controls to the Page object as shown below:
this.Controls.Add(html);
this.Controls.Add(body);
The output HTML would be as follows:
<html></html>
<body></body>
So care must be taken while adding the controls to the page. We need to
decide the hierarchy and add the controls to the appropriate parent control.
Conclusion
This article is written to provide an insight into the development of ASP+
pages using JScript.NET. Gone are those days when we only used VBScript and
JScript for developing server-side applications.
This article is not intended to be a complete tutorial on JScript.NET. To
learn more about JScript.NET, refer to the article "Introducing JScript.NET" (Introducing JScript.NET),
published at the Microsoft MSDN Web site. Not only can you program ASP+ pages
using C#, VB, JScript.NET, but there are lots of third-party vendors who are
developing or augmenting their languages to support .NET Runtime, and you have
the choice of using any of them.
By Raja Mani
