Incorporate A Word Counter
Into A Form

I ncorporating a word/character counter into a form is slightly more elaborate than the Stand Alone version on the top of the previous page.

R emember what you read on the main page about the attribute of wrap="virtual". Don't forget to add that into the textarea form otherwise in Netscape the text will not wrap and run out and you will have to scroll horizontally to see all the text.

T he main section of the code which is pasted into the <HEAD> section of the document still has no reconfigurations that you make. The reconfigurations are within the textarea box form that is inserted into your form. As you notice below, the first example is that of the default textarea box with size configurations and two x's.

<!---------- Start Body Section Of Code ---------->
<form>
<textarea cols=40 rows=6 wrap="virtual" name=x>
</textarea>
<br>
<input type=button value="Count Words" OnClick ="CountWords(this.form.x, true, true);">
</form>
<!---------- End Body Section Of Code ---------->

N ext we will show you what you need to remove from the default code before you add it to your form. What is color coded in RED you will remove. In other words, remove the words <form> </form>

<form>
<textarea cols=40 rows=5 wrap="virtual" name=x>
</textarea>
<br>
<input type=button value="Count Words" OnClick ="CountWords
(this.form.x, true, true);">
</form>

remove the words <form> </form>

B y now you are probably wondering about the two little yellow x's.
When you receive an email from a form, every field needs a subject so as to tell you what each answer means. When the word counter "Stands Alone" you need not concern yourself with the x's. they can stay as is.

W hen you incorporate the word/character counter within a form, you need to change the x's for the subject of the textarea box that is being used. In other words, what you want people to type into that word counter box, you need a subject for you to see when you receive the email transmission.

<!---------- Start Body Section Of Code ---------->
<textarea cols=40 rows=6 wrap="virtual" name=additionalcomments>
</textarea>
<br>
<input type=button value="Count Words" OnClick ="CountWords(this.form.additionalcomments, true, true);">
<!---------- End Body Section Of Code ---------->

I f it still is not clear, the next part of the example should clarify it for you.

Adding The Word Counter Textarea Box To The Form

<P>Your E-Mail Address
<BR><INPUT TYPE=TEXT NAME=replyemail SIZE=40></p>

<P>Additional Comments<br>
<textarea cols=40 rows=6 wrap="virtual" name=additionalcomments>
</textarea>
<br>
<input type=button value="Count Words" OnClick ="CountWords
(this.form.additionalcomments, true, true);"></P>

</TD></TR><TR><TD ALIGN=CENTER>
<BR><INPUT type="submit" name="submit" value="Submit Your Form"> 
<INPUT type="reset" name="reset" value="Clear Form"></TD>
</TR></TABLE></FORM></CENTER></FONT>

R emember what you read on the main page about the attribute of wrap="virtual". Don't forget to add that into the textarea form otherwise in Netscape the text will not wrap and run out and you will have to scroll horizontally to see all the text.

T he above example is how the word counter would look within a form. We hope it is now clear about the little x's and why you reconfigure the words for your form. The below is what we have shown with our tutorial and example. It is not a complete form as is the one on the previous page and will not function except for the word counter.

Your E-Mail Address

Additional Comments


Close Window ]
Back To Word Counter Page If Not Opened In New Window ]

I f you still have problems with this, feel free to contact us.
The Consigliere™

This Site Was Built And Is Maintained Exclusively by
Support Staff @ Consigliere™ Ltd.

Copyright © 2001-2002, The Consigliere™ Ltd., All Rights Reserved.