HTML Form - 2

Form Control: <select> element

The <select> element is the child control element of the <form> element. The <select> element is used to define the menu list control element of a form. Each menu item is held by an <option> element And menu items can also be groupped by the <optgroup> element in a singal hierachical level. There should have at least one item or one <option> element held by the <select> element. 

Form Control: <textarea> element

The <textarea> element is the child control element of the <form> element. The <textarea> element is used to define the multi-line text input control element of a form. Therefore more text can be entered by the user than an <input> element. And a <textarea> element can also held text content as the initial value

Form Control: <button> element

The <button> element is the child control element of the <form> element. The <button> element is used to define the button control element of a form similar to the buttons created by the <input> element, but the <button> element can hold content for rendering.
The button control type is specified by the attribute 'type' of the <button> element. The possible values of attribute 'type' are "submit", "reset",  and "button". The default value of the attribute 'type' is "submit".
However, the <button> element does not well supported by browsers, it is better to use the <input> element to create button in a form.

Control types of <button> element:

• The "submit" control 'type' is used to define a submit button in the form. When a submit button is activated, the form data is submitted to the server.
  

  Code Sample of single "submit" control 'type'

  <form action="http://sideway.hk">
  Input Text: <input type="text" name="txtinput"><br>
  <button  name="submit" type="submit" >
  <img src="../../../../../../../../images/arrowlt.gif"> Submit
  </button>
  </form>
  HTML web page:

  Input Text:
  Submit

• The "reset" control 'type' is used to define a reset button in the form. When a reset button is activated, all form controls are reset to their initial values.

  Code Sample of single "submit" control 'type'

  <form action="http://sideway.hk">
  Input Text: <input type="text" name="txtinput"><br>
  <button  name="reset" type="reset">
  Reset <img src="../../../../../../../../images/arrowrt.gif">
  </button>
  <button type="submit" >
  <img src="../../../../../../../../images/arrowlt.gif"> Submit
  </button>
  </form>
  HTML web page:

  Input Text:
  Reset Submit

• The "button" control 'type' is used to define a push button in the form. A clickable button is created with no default function like other specific functional button. However, the 'event' attributes of each clickable button can be used to activate the associated clinet-side scripts when the event of the button to trigger

  Code Sample of "button" control 'type'

  <form action="http://sideway.hk">
  <button  name="button" type="button" >
  press to open a new window <img src="../../../../../../../../images/arrowup.gif">
  </button>
  </form>
  HTML web page:

  press to open a new window