• andy chuks HTML Forms: How to Create Forms with HTML
    Share This, Tweet, +1 or Recommend   
    HTML forms are used to pass data to a server.

    A form can contain input elements like text fields, checkboxes, radio-buttons, submit buttons and more. A form can also contain select lists, textarea, fieldset, legend, and label elements.

    The <form> tag is used to create an HTML form:

    <form>
    .
    input elements
    .
    </form>
    The form tag must be embedded anywhere between the body tags <body></body> in the HTML document to make it work. To work fully form requires a server side programming language like PHP (we won't go into that now). You can Check PHP Class @ http://goo.gl/LxG6h

    To create a Form
    First you write the Form opening tag <form>
    Then enter form input elements eg <input type="text" />
    Then close the Form with closing tag </form>

    Text Fields

    <input type="text" /> defines a one-line input field that a user can enter text into:

    <form>
    First name: <input type="text" name="firstname" /><br />
    Last name: <input type="text" name="lastname" />
    </form>


    Password Field

    <input type="password" /> defines a password field:

    <form>
    Password: <input type="password" name="pwd" />
    </form>


    Radio Buttons

    <input type="radio" /> defines a radio button. Radio buttons let a user select ONLY ONE one of a limited number of choices:

    <form>
    <input type="radio" name="sex" value="male" /> Male<br />
    <input type="radio" name="sex" value="female" /> Female
    </form>

    Checkboxes

    <input type="checkbox" /> defines a checkbox. Checkboxes let a user select ONE or MORE options of a limited number of choices.

    <form>
    <input type="checkbox" name="vehicle" value="Bike" /> I have a bike<br />
    <input type="checkbox" name="vehicle" value="Car" /> I have a car
    </form>

    Text Area

    Textarea <textarea></textarea> is where user can enter huge amount of text. Unlike the text field, it contains big amount of text.
    <form>
    <textarea rows="10" cols="30">
    The cat was playing in the garden.
    </textarea>
    </form>

    DropDown List <select><option></option></select> is used to list options that can be selected by user.

    <form action="">
    <select name="books">
    <option value="Achebe1">Thing Fall Apart</option>
    <option value="Achebe2">No longer at Ease</option>
    <option value="Achebe3">A Man of the People</option>
    <option value="Achebe4">Chike and the River</option>
    </select>
    </form>



    Submit Button

    <input type="submit" /> defines a submit button.

    A submit button is used to send form data to a server. The data is sent to the page specified in the form's action attribute. The file defined in the action attribute usually does something with the received input:

    <form name="input" action="html_form_action.asp" method="get">
    Username: <input type="text" name="user" />
    <input type="submit" value="Submit" />
    </form>     22 April 2011Comment
    Share This, Tweet, +1 or Recommend   
    • andy chuks Ask Questions if you are confused.
      Assignment: Create a Webpage containing a dropdown menu form with a preselected option.
      Like It0 Unlike It0 22 April 2011
    • dan henry I'd prefer working with the design view when i'm on Dreamweaver cos the language coding can really be pretty hard to understand.Creating a form is not necessarily a problem to me but but adding an action to it,i mean the submission aspect.How do i do this using Dreamweaver or even FrontPage?
      Like It0 Unlike It0 30 December 2011