.NET Web Forms
Client-Side JavaScript
© 2002 by Jerry Post
1
Syntax: C variant
Netscape
http://developer.netscape.com/docs/manuals/communicator/dynhtml/index.htm
Microsoft
http://msdn.microsoft.com/library
Web Development + HTML and Dynamic HTML + SDK Documentation +
Reference
Variables: var i; (does not support data types)
Conditions if (i > 10) { … }
Loops while (condition) { … }
Functions function myFn(a, b, c) { … }
No pointers!
alert(“Message”) helps with debugging
WARNING: Everything in Javascript is case-sensitive!!!!
2
Document Object Model (DOM)
Anything you really want to do in client JavaScript relies on the
document object model.
The “old” Netscape DOM has nothing in common with
The “standard” Microsoft DOM
Which is good, since the Netscape version was awful.
Two primary elements to learn
Reference to objects on the page (especially in forms)
Events
3
Document/Form Items
Refer to a value: document.form1.UserID.value
Submit a form with a button (rare): onClick=“this.form.submit()”
4
Form Validation
Today, build it into ASP .NET and let it write the code.
But, in case you need more detailed code:
Function ValidateMe() {
// a bunch of if tests on document.form1.whatever
if (valid) {
return true;
} else {
return false;
}
}
5
Events
Many objects on the page support events. Common list:
click
focus
onmouseover
Onmouseout
Easiest structure is to define functions to handle each desired
event, and then add the appropriate call to the object:
6
Setting focus
A common script task is the ability to set focus to the initial text
element. Strangely, ASP .NET does not yet support this feature.
Put the script at the end of the document, and double-check that
control exists before you set focus (to ensure the form is loaded).
if(document.Form1.txtUser != null) document.Form1.txtUser.focus();
7
Rollover Effects
Commonly used with buttons. You can add the code to an asp
button, or to an HTML button. It will only work with Microsoft
Internet Explorer.
8
Drop-Down Menus
These require relatively complex code.
The code is really ugly if you want to support
Netscape as well as Microsoft.
Several versions can be found on the Internet.
Only a few support Netscape.
Microsoft documentation (MSDN) a couple of
years ago had a nice system that uses XML
and XSL to set the menu items. Style was
controlled through style sheets, so the system
was easy to implement.
ASP .NET does support a tree-structure
control, but it probably requires a round-trip for
each click.
It would take a dedicated class in JavaScript to
cover all of the details to write your own.
9