HTML Goodies: Script Tip: Week 23
WEBINAR: On-demand Event
Replace Oracle with the NoSQL Engagement Database: Why and how leading companies are making the switch REGISTER >
Now that we're up to speed with the prompts at the top of the script, let's go in the complete opposite direction and look at the HTML form elements at the very bottom of the script.
But first, you might need to take another look at the script itself.
Here's the part I'm interested in for this Script Tip:
<TEXTAREA COLS="40" ROWS="20" NAME="maintext">
<INPUT TYPE="submit" VALUE="Send It" onClick="verify()">
I'm not trying to throw you here. I have taken out some of the coding that was in there. As you can see, all the METHOD= and ACTION= and ENCTYPE= code is out. I am interested in showing you simply the HTML form elements. And in this script those elements include:
- The main FORM command
- The TEXTAREA box
- The Submit button
Terms, terms, terms...
Okay, back to the HTML form elements. Let's deal with just the top two at the moment: The main FORM command and the TEXTAREA box.
Notice that the name of the FORM itself is "gbookForm." See that above? It's denoted by writing NAME="gbookForm." That seems pretty easy to grasp.
The TEXTAREA box is then named "maintext" through the same NAME= format as above.
- The entire form is sitting in the HTML document, so we start with "document."
- The name of the FORM is "gbookForm." That's next.
- The name of the TEXTAREA box is "maintext."
- Each item is separated by a dot to show relationship.
But we're not done yet. If we simply go with document.gbookForm.maintext, we will not get what is written within the box. We'll get information about the box itself, because the box is as far down the line as the hierarchy statement goes. We need to take one more step:
To actually get what's in the box, add "value" to the end of the hierarchy statement. Now we're complete:
The form elements finish off with a basic Submit button that acts to send the mail from the script, as any other simple mailto: guestbook would. In addition, there is this onClick command:
...and you thought you were busy.
Next Week: The Function
HTML Goodies 30-Step Primer Series
and take the knowledge home with you in
on your Web pages here!