Suite101

Forms - part 1


© Oisin Prendiville

This month I will be talking about forms. There has been some confusion among readers of my forms tutorial at http://www.usheen.com/html/tut9.html, which I will try to avoid in this article. Forms are a way to get input from your visitors. They can be used for many things: to receive comments, suggestions, orders, as a search engine, and much more. The basics of forms are quite easy to understand and I will explain these in this article and the next but the complicated part is what goes on behind the scenes and that involves more than just html. I will discuss that at the end of the second article.

Let's get started on the easier part for now though. The form is contained between the <form> & </form> tags. There are attributes to be set in the <form> tag but they depend on more complicated things, which will be discussed next month.

<form>
</form>

To receive input you can use input boxes, check boxes, radio boxes, selection lists or text areas. I will not be able to cover all of these this month but will concentrate instead of just a few of them. You must assign a name to every item you place in the form, the reason for this will become obvious in time; you don't have to worry about that now.

Text areas are usually used for submitting comments or suggestions. Basically a text area is a blank section of your page where the visitor can click and then type in what she wishes. You must specify how wide and how tall this area to be, and of course you must also set a name for it. If you want any text to appear as default simply place it between the <textarea> and </textarea> tags. If you do not want any default text you MUST place the </textarea> tag directly after the <textarea> tag.

<form>
<textarea name="comments" rows=5 cols=40>
Please place your comments here.
</textarea>
</form>

This text area will have 5 rows and will be wide enough to fit 40 characters on one line; the actual width in pixels depends on the visitor's browser.

As I said a text area is best for receiving comments; this is because it can provide quite a large area for the visitor to type. However for things like email addresses or names you only want one line of space and there is no need for a scrollbar at the side. For information like this you should use an input box.

Go To Page: 1 2


The copyright of the article Forms - part 1 in HTML Lessons is owned by Oisin Prendiville. Permission to republish Forms - part 1 in print or online must be granted by the author in writing.

Post this Article to facebook Add this Article to del.icio.us! Digg this Article furl this Article Add this Article to Reddit Add this Article to Technorati Add this Article to Newsvine Add this Article to Windows Live Add this Article to Yahoo Add this Article to StumbleUpon Add this Article to BlinkLists Add this Article to Spurl Add this Article to Google Add this Article to Ask Add this Article to Squidoo