Windows NT Internet and Intranet Development

To learn more about author Sanjaya Hettihewa, please visit the author's homepage.

Previous chapterNext chapterContents


- 22 -

Manipulating Web-Browser Objects and Events


Certain Web-browser objects and events are exposed to client-side scripting languages such as VBScript. These objects and events can be used to develop richly interactive Web applications that manipulate not only aspects of the Web page (background color of a document, for example) but also features of the Web browser (such as a message on the status bar). By the end of this chapter, you will be able to develop VBScript Web applications that manipulate Web-browser events and objects.

All About Objects, Properties, Events, and Methods

Objects, properties, events, and methods of objects exposed to VBScript can be manipulated to develop highly interactive Web applications. Before you can fully understand the material presented in this chapter, you must understand what objects, properties, events, and methods are.

Objects

Objects are self-contained Web-application components (think of them as bricks). By themselves, objects, like bricks, perform certain limited tasks, but are generally not particularly useful. However, like bricks, several objects can be linked to create useful applications. Objects are linked together using object interfaces (mortar) in the form of properties, events, and methods. These object interfaces can be manipulated by client-side scripting languages such as VBScript.

Properties

Object properties can be used to change the characteristics of an object. For example, the value property of a text object can be changed to assign new text to a text box.

Events

Object events are triggered when certain actions occur. VBScript applications can listen and respond to events of objects. For example, a VBScript subroutine can verify and submit the contents of an HTML form when the button object's onClick event is triggered as a result of a user clicking the button.

Methods

Object methods are used to emulate user interactions on objects. For example, the click method of the button object can be used to simulate a user clicking a button object.

HTML Form Objects and Events

HTML form objects and events can be used to obtain and validate user input. The following sections discuss and demonstrate how properties, events, and methods of HTML form objects can be manipulated to develop interactive Web applications.

The button Object

The button object is simply a pushbutton in an HTML form. The button object supports the following properties, events, and methods.

Properties of the button Object

The properties of the button object are used to interface with the name and value of the button object.

Events of the button Object

Events of the button object are used to detect user interactions on the button object.

Methods of the button Object

Methods of the button object are used to simulate user interactions on the button object.


Note:The click method does not call the onClick event.

The next section demonstrates how to manipulate properties and events of the button object. Properties and events of other objects presented in this chapter can be manipulated in very much the same way. See Chapter 23, "Developing VBScript Applications," for additional Web browser object manipulation examples.

Using the button Object

The application in Listing 22.1 (see Figure 22.1) demonstrates how properties and events of the button object can be manipulated by a VBScript application (Figure 22.1 contains the Web page generated by Listing 22.1). Notice how the onClick event is used in line 33 to display a message box and change the value of the pushbutton. The subroutine declared in line 33 uses the global variable declared in line 14 to track the number of times the pushbutton has been clicked.

I recommend that you experiment with the application in Listing 22.1 by browsing \Chap-22\Button.htm in the CD-ROM kit that accompanies this resource library.

Listing 22.1. Using the button object.

 1: <!--
 2: © 1996 Sanjaya Hettihewa (http://www.NetInnovation.com/)
 3: All Rights Reserved.
 4: Permission is hereby given to modify and distribute this code as
 5: you wish provided that this block of text remains unchanged.
 6:  !-->
 7:
 8: <HTML>
 9: <HEAD>
10: <TITLE>Using The Button Object</TITLE>
11:     <SCRIPT LANGUAGE="VBScript">
12: <!--
13:
14: Dim NumPushes
15:
16: NumPushes = 0
17:
18: -->
19:     </SCRIPT>
20: </HEAD>
21: <BODY BGCOLOR="FFFFFF">
22:
23: <H1><P>Using the button object.</P></H1>
24:
25: <form name="ButtonForm">
26:     <input type="button" name="PushButton"
27:       value="I am a button. No one has clicked on me yet. Click me!"><BR>
28: </form>
29:
30:     <SCRIPT LANGUAGE="VBScript">
31: <!--
32:
33: Sub PushButton_OnClick
34:
35:   MsgBox "Thanks for clicking the button!"
36:   NumPushes = NumPushes + 1
37:   ButtonForm.PushButton.value = "I have been pressed " & NumPushes & _
38:     " times. Click me again!"
39:
40: End Sub
41:
42: -->
43:     </SCRIPT>
44:
45: </BODY>
46: </HTML> 


The dialog box in Figure 22.2 is displayed each time a user clicks the pushbutton.

As soon as the message box is acknowledged, the value of the pushbutton is updated to reflect the number of times the pushbutton has been clicked (as shown in Figure 22.3).

Figure 22.1. The application in Listing 22.1 before any user interactions.

Figure 22.2. A dialog box is displayed when the pushbutton is clicked.

Figure 22.3. The value of the pushbutton changes after the dialog box in Figure 22.2 is acknowledged.


The checkbox Object

The checkbox object is simply a check box in an HTML form. The checkbox object supports the following properties, events, and methods.

Properties of the checkbox Object

Properties of the checkbox object are used to obtain information about the current status of the checkbox object.

Events of the checkbox Object

Events of the checkbox object are used to detect user interactions on the checkbox object.

Methods of the checkbox Object

Methods of the checkbox object are used to simulate user interactions on the checkbox object.


Note: The click method does not call the onClick event.

The form Object

The form object is composed of all the elements of an HTML form and supports the following properties, events, and methods.

Properties of the form Object

The properties of the form object are used to interface with various actions of the form object.

Events of the form Object

Events of the form object are used to detect user interactions on the form object.

Methods of the form Object

Methods of the form object are used to simulate user interactions on the form object.


Note: The submit method does not call the onSubmit event.

The hidden Object

The hidden object is used to refer to hidden HTML form variables in an HTML form. Hidden HTML form variables are used to pass certain values to CGI applications. The hidden object supports the following properties, events, and methods.

Properties of the hidden Object

The properties of the hidden object are used to interface with the name and value of the hidden object.

Events of the hidden Object

Methods of the hidden Object

The password Object

The password object is used to refer to password data-entry fields of an HTML form. The password object supports the following properties, events, and methods.

Properties of the password Object

The properties of the password object are used to interface with the defaultValue, name, and current value of the form object.

Events of the password Object

Methods of the password Object

Methods of the password object are used to simulate user interactions on the password object.

The radio Object

Radio buttons allow the user to select an item from a list. The radio object is used to refer to radio objects in an HTML form. The radio object supports the following properties, events, and methods.

Properties of the radio Object

Properties of the radio object are used to obtain certain information about the radio object.

Events of the radio Object

Events of the radio object are used to detect user interactions on the radio object.

Methods of the radio Object

Methods of the radio object are used to simulate user interactions on the radio object.


Note: The click method does not call the onClick event.

The reset Object

The reset object refers to the Reset button of an HTML form. The reset object supports the following properties, events, and methods.

Properties of the reset Object

Properties of the reset object are used to interface with the name and value of the reset object.

Events of the reset Object

Events of the reset object are used to detect user interactions on the reset object.

Methods of the reset Object

Methods of the reset object are used to simulate user interactions on the reset object.


Note: The click method does not call the onClick event.

The select Object

The select object is used to allow the user to pick items from a list of predefined items. The select object is more complicated than other HTML data-entry field objects. However, it is used the same way other HTML data-entry fields are used. The select object just happens to have a few extra properties associated with it. The submit object supports the following properties, events, and methods.

Properties of the select Object

Properties of the select object are used to obtain certain information about it.

Properties of the options Object Properties of the options object are used to obtain certain information about it.

Events of the select Object

Events of the select object are used to detect user interactions on the select object.

Methods of the select Object

The submit Object

The submit object refers to the Submit button of an HTML form and is used to submit the contents of an HTML form to a Web-server application for processing. The submit object supports the following properties, events, and methods.

Properties of the submit Object

Properties of the submit object are used to obtain certain information about the submit object.

Events of the submit Object

Events of the submit object are used to detect user interactions on the submit object.

Methods of the submit Object

Methods of the submit object are used to simulate user interactions on the submit object.

The click method does not call the onClick event.

The text Object

The text object is used to refer to text data-entry fields of an HTML form. The text object supports the following properties, events, and methods.

Properties of the text Object

Properties of the text object are used to obtain certain information about the text object.

Events of the text Object

Events of the text object are used to detect user interactions on the text object.

Methods of the text Object

Methods of the text object are used to simulate user interactions on the text object.

The textarea Object

The textarea object is used to refer to textarea data-entry fields of an HTML form. The textarea object supports the following properties, events, and methods.

Properties of the textarea Object

Properties of the textarea object are used to obtain certain information about the textarea object.

Events of the textarea Object

Events of the textarea object are used to detect user interactions on it.

Methods of the textarea Object

Methods of the textarea object are used to simulate user interactions on it.

The Window Object

The Window object is perhaps the most complex object exposed to client-side scripting languages because it encapsulates a series of other objects. See Figure 22.4 for a representation of the Window object hierarchy.

Figure 22.4. The Window object hierarchy.


The Frame Object

The Frame Object

The Frame object is used to manage frames and windows.

Properties of the Frame Object

Properties of the Frame object are used to obtain information about the current frame set.

Events of the Frame Object

Events of the Frame object are used to detect user interactions on the Frame object.

Methods of the Frame Object

Methods of the Frame object are used to manipulate various aspects of the Web- browser window and display messages to the user.

The History Object

The History object can be used to make use of the Web browser's history list to transfer the user to a previously visited URL.


Note: VBScript applications are not allowed to directly access URL values of previously visited Web pages due to privacy and security reasons.

Properties of the History Object

Properties of the History object contain the number of URLs stored in the History object.

Events of the History Object

Methods of the History Object

The History object is used to guide the user to a URL. The URL can either be a previously visited URL or a specified URL.

The Navigator Object

The Navigator object contains information about the Web browser. A VBScript application can use the Navigator object to determine capabilities of the Web browser. The Navigator object supports the following properties, events, and methods.

Properties of the Navigator Object

See Figures 22.5-22.8 for Microsoft Internet Explorer 3.01 properties of the Navigator object. The figures were generated by the VBScript application in Listing 22.2. Use the Web page included in the CD-ROM kit that accompanies this resource library to determine what properties of the Navigator object you use.

Figure 22.5. The appCodeName of Internet Explorer 3.01 as reported by the navigator.app CodeName property.

Figure 22.6. The appName of Internet Explorer 3.01 as reported by the navigator.app Name property.

Figure 22.7. The appVersion of Internet Explorer 3.01 as reported by the navigator.app Version property.

Figure 22.8. The userAgent of Internet Explorer 3.01 as reported by thenavigator.user Agentproperty.

I recommend that you experiment with the application in Listing 22.2 by browsing \Chap-22\Navigator.html on the CD-ROM kit that accompanies this resource library.

Listing 22.2. Properties of the Navigator object.

<!--
© 1996 Sanjaya Hettihewa (http://www.NetInnovation.com/)
All Rights Reserved.
Permission is hereby given to modify and distribute this code as
you wish provided that this block of text remains unchanged.
 !-->
<HTML>
<HEAD>
<TITLE>Properties of the Navigator Object</TITLE>
</HEAD>
<BODY BGCOLOR="FFFFFF">
<H1><P>Properties of the Navigator Object</P></H1>
    <SCRIPT LANGUAGE="VBScript">
<!--
  MsgBox "The appCodeName of the Web browser you are using is: " _
    & navigator.appCodeName
  MsgBox "The appName of the Web browser you are using is: " _
    & navigator.appName
  MsgBox "The appVersion of the Web browser you are using is: " _
    & navigator.appVersion
  MsgBox "The userAgent of the Web browser you are using is: " _
    & navigator.userAgent
  Document.Write  "The appCodeName of the Web browser you are using is: " _
    & Navigator.appCodeName & "<BR>"
  Document.Write  "The appName of the Web browser you are using is: " _
    & Navigator.appName & "<BR>"
  Document.Write  "The appVersion of the Web browser you are using is: " _
    & Navigator.appVersion & "<BR>"
  Document.Write  "The userAgent of the Web browser you are using is: " _
    & Navigator.userAgent & "<BR>"
-->
    </SCRIPT>
</BODY>
</HTML>

Events of the Navigator Object

Methods of the Navigator Object

The Location Object

The Location object is used to obtain information about the currently loaded URL. The following properties are accessible via the Location object.

Properties of the Location Object

Properties of the Location object are used to obtain information about the currently loaded URL.

Events of the Location Object

Methods of the Location Object

The Document Object

The Document object can be used to display messages to the user and modify the appearance of Web-page elements such as the background and foreground color.

Properties of the Document Object

Properties of the Document object are used to modify various properties of a Web page such as the background and foreground color.

Events of the Document Object

Methods of the Document Object

Various methods of the Document object are used to display messages on the Web- browser window.

Summary

Properties, events, and methods of Web-browser objects can be manipulated by VBScript applications to create sophisticated Web applications that are richly interactive.


Previous chapterNext chapterContents


© Copyright, Macmillan Computer Publishing. All rights reserved.