535Chapter 23 .The Form and Related Objects Tip The best opportunity to change the properties of a FORM element object is in a function invoked by the form s onSubmit event handler. The modifications are performed at the last instant prior to actual submission, leaving no room for user- induced glitches to get in the way. Buttons in forms A common mistake that newcomers to scripting make is defining all clickable buttons as the submit type of inputobject (). The Submit button does exactly what it says it submits the form. If you don t set any METHOD or ACTION attributes of the
534 Part III . Document Objects Reference Many ISPs that host Web sites provide standard CGIs for forwarding forms to an e-mail address of your choice. This manner of capturing form data, however, does not also capture the visitor s e-mail address unless your form has a field where the visitor voluntarily enters that information. Note Under no circumstances is a form submitted via the mailto: URL a secure document. The form data is embedded within a plain e-mail message that goes through the same Internet routes and servers as any e-mail message. The remaining discussion about mailing forms focuses primarily on NN2+ and IE5+ browsers. You should be aware that mailing forms in the following ways is controversial in some Web standards circles. As of this writing, the W3C HTML specification does not endorse these techniques specifically. However, the latest browsers do support them nonetheless. Use these facilities judiciously and only after extensive testing on the client browsers you intend to support. If you want to have forms submitted as e-mail messages, you must attend to three
533Chapter 23 .The Form and Related Objects Tip a live connection with its object. To modify a property of the object that invokes an event handler function, you need to pass some object reference so that the function knows where to go to work on the object. Many programmers with experience in other languages expect parameters to be passed either by reference or by value, but not both ways. The rule of thumb in JavaScript, however, is fairly simple: object references are passed by reference; property values are passed by value. Here are some guidelines to follow when deciding what kind of value to pass to an event handler function: . Pass the entire form control object (this) when the function needs to make subsequent access to that same element (perhaps reading an object s value property, converting the value to all uppercase letters, and then writing the result back to the same object s value property). . Pass only one property (this.propertyName) when the function needs read- only access to that property. . Pass the entire FORM element object (this.form) for the function to access multiple elements inside a form (for example, a button click means that the function must retrieve a field s content). Also be aware that you can submit multiple parameters (for example, onClick= someFunction (this.form, this.name) ) or even an entirely different object from the same form (for example, onClick= someFunction (this.form.emailAddr.value) ). Simply adjust your function s incoming parameters accordingly. (See Chapter 41 for more details about custom functions.) E-mailing forms A common request among scripters is how to send a form via e-mail to the page s author. This includes the occasional desire to send secret e-mail to the author whenever someone visits the Web site. Let me address the privacy issue first. A site visitor s e-mail address is valuable personal information that you should not retrieve without the visitor s permission or knowledge. That s one reason why Netscape plugged a privacy hole in Navigator 2 that allowed submitting a form to a mailto: URL without requesting permission from the user. You can use some workarounds for this in Navigator 3, but I do not condone surreptitiously lifting e-mail addresses and therefore choose not to publicize those workarounds here. Besides, as more users gravitate to newer browser versions, the workarounds fail anyway. Microsoft, on the other hand, went too far in preventing forms e-mailing in the earliest browser versions. While Netscape s browsers reveal to the user in an alert that an e-mail message bearing the user s e-mail address (as stored in the browser s preferences) will be sent upon approval, Internet Explorer 3 does not send form content via e-mail at all. Internet Explorer 4 sends form content as an attachment through Microsoft Outlook, but only after displaying a mail composition window to the user. Starting with IE5, the process is much more fluid, but the action works best when Outlook is the default e-mail client on the computer. FORM Visit our web design programs services for an affordable and reliable webhost to suit all your needs.
532 Part III . Document Objects Reference The reference to the form contains everything the browser needs to know to find that form within the document. Any statements in the function can therefore use the parameter value in place of the longer, more cumbersome reference to the form. Thus, here I can use form to take the place of document.forms[0]in any address. To get the value of the song field, the reference is: form.song.value Had I assigned the form object to a parameter variable called sylvester, the reference would have been: sylvester.song.value When a function parameter is a reference to an object, statements in the function can retrieve or set properties of that object as well as invoke the object s methods. Another version of the thisparameter passing style simply uses the word this as the parameter. Unlike this.form, which passes a reference to the entire form connected to a particular element, thispasses a reference only to that one element. In Listing 23-1, you can add an event handler to the songfield to do some validation of the entry (to make sure that the entry appears in a database array of Beatles songs created elsewhere in the document). Therefore, you want to send only the field object to the function for analysis:
You then have to create a function to catch this call: function checkSong(songTitle) { var enteredSong = songTitle.value alert( Making sure that + enteredSong + was recorded by the Beatles. ) } Within this function, you can go straight to the heart the valueproperty of the field element without a long reference. One further extension of this methodology passes only a single property of a form control element as a parameter. In the last example, the checkSong() function needs only the value property of the field, so the event handler can pass this. value as a parameter. Because this refers to the very object in which the event handler appears, the this.propertyNamesyntax enables you to extract and pass along a single property:
A benefit of this way of passing form element data is that the function doesn t have to do as much work: function checkSong(songTitle) { alert( Making sure that + songTitle + was recorded by the Beatles. ) } Unlike passing object references (like the form and text field objects above), when you pass a property value (for example, this.value), the property s value is passed with no reference to the object from which it came. This suffices when the function just needs the value to do its job. However, if part of that job is to modify the object s property (for example, converting all text from a field to uppercase and redisplaying the converted text), the value passed to the function does not maintain FORM We recommend high quality webhost to host and run your jsp application: christian web host services.