To learn more about author Sanjaya Hettihewa, please visit the author's homepage.
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.
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 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.
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.
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.
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 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 is simply a pushbutton in an HTML form. The button object supports the following properties, events, and methods.
The properties of the button object are used to interface with the name and value of the button object.
Events of the button object are used to detect user interactions on 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.
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.
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 is simply a check box in an HTML form. The checkbox object supports the following properties, events, and methods.
Properties of the checkbox object are used to obtain information about the current status of the checkbox object.
Events of the checkbox object are used to detect user interactions on 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 is composed of all the elements of an HTML form and supports the following properties, events, and methods.
The properties of the form object are used to interface with various actions of the form object.
Events of the form object are used to detect user interactions on 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 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.
The properties of the hidden object are used to interface with the name and value of the hidden 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.
The properties of the password object are used to interface with the defaultValue, name, and current value of the form object.
Methods of the password object are used to simulate user interactions on the password 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 are used to obtain certain information about the radio object.
Events of the radio object are used to detect user interactions on 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 refers to the Reset button of an HTML form. The reset object supports the following properties, events, and methods.
Properties of the reset object are used to interface with the name and value of the reset object.
Events of the reset object are used to detect user interactions on 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 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 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 are used to detect user interactions on the select 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 are used to obtain certain information about the submit object.
Events of the submit object are used to detect user interactions on 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 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 are used to obtain certain information about the text object.
Events of the text object are used to detect user interactions on the text object.
Methods of the text object are used to simulate user interactions on the text 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 are used to obtain certain information about the textarea object.
Events of the textarea object are used to detect user interactions on it.
Methods of the textarea object are used to simulate user interactions on it.
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 is used to manage frames and windows.
Properties of the Frame object are used to obtain information about the current frame set.
Events of the Frame object are used to detect user interactions on 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 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 contain the number of URLs stored in 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 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.
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.
<!-- © 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>
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 are used to obtain information about the currently loaded URL.
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 are used to modify various properties of a Web page such as the background and foreground color.
Various methods of the Document object are used to display messages on the Web- browser window.
Properties, events, and methods of Web-browser objects can be manipulated by VBScript applications to create sophisticated Web applications that are richly interactive.
© Copyright, Macmillan Computer Publishing. All rights reserved.