Microsoft KB Archive/315604

= HOW TO: Change the State of an HTML Control Based on the Value of Another HTML Control =

Article ID: 315604

Article Last Modified on 4/21/2006

-

APPLIES TO


 * Microsoft Internet Explorer 5.5

-



This article was previously published under Q315604



IN THIS TASK
SUMMARY
 * Requirements
 * Detect the Property Change Event
 * Verify That It Works

REFERENCES



SUMMARY
This step-by-step article demonstrates how to use object events to handle user interaction with Web page elements. In this article, you create a sample that handles the onPropertyChange event to take action when the user selects or clears a check box.

Dynamic Hypertext Markup Language (DHTML) provides an extensive object model for Hypertext Markup Language (HTML) and exposes all Web page elements as objects that can be scripted. You can manipulate DHTML objects to change style attributes or other properties for Web page elements with script. With DHTML, you can handle user interaction with Web page elements by means of object events.

back to the top

Requirements
The following list outlines the recommended hardware, software, network infrastructure, and service packs that are required:
 * Internet Explorer 5.5 or later

This article assumes that you are familiar with the following topics:
 * HTML
 * DHTML

back to the top

Detect the Property Change Event
 Open a text editor such as Notepad.  Add the following code to the file:       Function Check1_OnPropertyChange Text1.Disabled = Not(Check1.Checked) End Function  </HTML> </li> Save the file as C:\PropChangeDemo.htm.</li></ol>

back to the top

Verify That It Works

 * 1) Start Internet Explorer.
 * 2) Type C:\PropChangeDemo.htm in the Address bar. The HTML page contains a check box and a text box. Notice that the check box is selected and that the text box is empty.
 * 3) Type any text in the text box to verify that the text box is enabled.
 * 4) Click to clear the check box. This fires the onPropertyChange event. The event handler method in the HTML page disables the text box.
 * 5) Try to type additonal text in the text box. Notice that you cannot type any text because the text box is disabled.
 * 6) Click to select the check box. This fires another onPropertyChange event. The event handler method enables the text box.
 * 7) Type additional text in the text box. Notice you can type text now because the text box is enabled again.

back to the top

<div class="references_section">