An <OBJECT> Example - Using a Spin Button
Let's see an example to demonstrate what we're talking about. Open a new file in NotePad and enter this:
<HTML> <HEAD> <TITLE> Objects </TITLE> </HEAD> <BODY> <CENTER> <H1> Objects </H1> <FORM NAME="frmTest"> Spin Value: <INPUT TYPE="TEXT" NAME="txtSpinValue"><P> </FORM> <OBJECT CLASSID="clsid:79176FB0-B7F2-11CE-97EF-00AA006D2776" ID="spnTest" CODEBASE="http://activex.microsoft.com/controls/mspert10.cab"> </OBJECT> <SCRIPT LANGUAGE="VBScript"> Sub spnTest_Change Document.frmTest.txtSpinValue.Value = spnTest.Value End Sub </SCRIPT> </CENTER> </BODY> </HTML>
If you load this page into Internet Explorer, you'll notice that a text box and two spin buttons. You've probably seen these in other Windows applications, but perhaps not in an HTML page.
Spin buttons aren't one of the standard HTML form control elements, so we've created one ourselves with an
<OBJECT> tag. Click on the up and down buttons and notice how the value in the text box changes—the code in our page connects the spin button's
Change event with the text box, so the text box is updated each time the spin button is clicked.
The spin button control we're using here is from the Forms 2.0 Object Library. If you've installed the ActiveX Control Pad, Visual InterDev, the HTML Layout Control, or Internet Explorer 3.01 or 3.02, you'll have this file installed and registered on your system. However, with the additional
CODEBASE attribute we've added, the file will be automatically downloaded from the Microsoft site if it's not already present on the machine you use to view this page.
Displaying the Spin Button's Value Property
We'll now briefly go over the code that causes the text box to interact with the spin button control. With the background we acquired from the last chapter, it's easy to understand what the script code on this page is doing.
We're using the
ObjectName_EventName method of connecting code to an object's event. The spin button control fires an event called
Change whenever its value changes. It also supports events called
SpinDown that are only fired on an up or down click, respectively. For our purposes
Change is fine, so that's the only event we'll handle.
<SCRIPT LANGUAGE="VBScript"> Sub spnTest_Change Document.frmTest.txtSpinValue.Value = spnTest.Value End Sub </SCRIPT>
The code that we execute when the value changes is simple. The spin button object's current value is stored in a property called
Value. Because we've named the object
spnTest, we can access this number with the code
spnTest.Value. The rest of the code on this line is just performing an assignment to the
Value property of the text box (named
txtSpinValue) on our form (named
frmTest). We see the results of this assignment on the HTML page when the value displayed by the text box changes as we click the spin button.
Presetting the Value with a Parameter Tag
Now imagine that the page is not an
.htm file, but an Active Server Page on our Intranet server. The spin button and text box display the number of items on a customer's order. If they are reviewing an existing order, it needs to be set to the value of the current order, ready for the customer to increase the quantity, if need be.
<OBJECT> tag we used earlier sets the value of the spin button when it's created in the page to the default of zero. How do we go about setting it to a different 'default' value? The answer is to add a
<PARAM> tag to the code. This example sets the value to
<OBJECT CLASSID="clsid:79176FB0-B7F2-11CE-97EF-00AA006D2776" ID="spnTest" CODEBASE="http://activex.microsoft.com/controls/mspert10.cab"> <PARAM NAME="Position" VALUE="10"> </OBJECT>
In effect, all it's doing is setting a property to a default value. In fact, the code uses
Position rather than
Value, but the result is the same. When the object is created, its value will be
The only real way to work with objects like this is to use Microsoft's ActiveX Control Pad, or an equivalent such as Visual InterDev, which understands how to insert objects and set the properties.
Doing It From a Database
This still doesn't answer the whole question, though. The value won’t be a static number, it will be a value in a database. No problem, because the page is an
.asp file rather than a normal
.htm page. It can get the value and insert it into the
<PARAM> tag, as well as into the text box:
... <% Set oConn = Server.CreateObject("ADODB.Connection") oConn.Open "Contacts" Set oRs = oConn.Execute("SELECT * FROM Orders WHERE OrderNo = 'PR0172'") strExistingQty = CStr(oRs.Fields("Quantity")) oRs.Close %> ... <FORM NAME="frmTest" ACTION="AmendOrder.asp> Spin Value: <INPUT TYPE="TEXT" NAME="txtSpinValue" VALUE="<% = strExistingQty %>"> <P> </FORM> ... <OBJECT CLASSID="clsid:79176FB0-B7F2-11CE-97EF-00AA006D2776" ID="spnTest" CODEBASE="http://activex.microsoft.com/controls/mspert10.cab"> <PARAM NAME="Position" VALUE="<% = strExistingQty %>"> </OBJECT> ...
When it arrives at the client, ready to be displayed in the browser, the values have been filled in, and of course the ASP code is not sent anyway:
... <FORM NAME="frmTest" ACTION="AmendOrder.asp> Spin Value: <INPUT TYPE="TEXT" NAME="txtSpinValue" VALUE="10"> <P> </FORM> ... <OBJECT CLASSID="clsid:79176FB0-B7F2-11CE-97EF-00AA006D2776" ID="spnTest" CODEBASE="http://activex.microsoft.com/controls/mspert10.cab"> <PARAM NAME="Position" VALUE="10"> </OBJECT> ...
This is just a simple example, there are many other things we could do, for example we should be more thorough when querying the database of course. However, it's enough to illustrate the point that we are now firmly into client/server territory. The server creates the page containing the existing values, but the client is 'active' in the sense that it can handle all the work of setting the text box value without needing further involvement from the server.
Beyond Properties: Calling Methods
Like we've said, dealing with objects on the client is very similar to working with objects on the server. Where the methods of an object are concerned, they're actually exactly the same. Suppose we've already created an object, and assigned it's reference to a variable named
objVar. Further, suppose that this object has a method called
myMethod. Whether we're executing code in the browser or on the server, the way we call this method is identical:
Beyond Properties: Handling Events
While intrinsic ASP objects like
Application have events, objects we create and use on the server don't generally fire events. Our exposure to these objects is limited to method calls and property access. As you've seen in the previous chapter, many objects on the client-side do fire events—it's one of the most commonly used ways to execute code.
The syntax to connect code to an object's event is exactly the same for user-created objects as it is for objects in the browser object model, and depends on the style we choose to connect our code to the event. Different methods of hooking up event code were discussed at length at the beginning of the last chapter. Our choice may depend on the scripting language. In VBScript, we can use:
<SCRIPT LANGUAGE="VBScript"> Sub ObjectName_Event1Name ... End Sub Sub ObjectName_Event2Name ... End Sub </SCRIPT>
<SCRIPT> block. Also since adding the event name to the
This style can also be used with VBScript code if you wish.