PHP Form Elements

Form Element List

The following table lists HTML elements in forms.

Element	Description
input type="checkbox"	A checkbox that lets users select multiple options.
input type="file"	A text box plus a button that opens a file selection dialog.
input type="hidden"	A hidden form element.
input type="password"	A password text box.
input type="radio"	A radio button.
input type="reset"	A button to clear the form.
input type="submit"	A button to submit the form.
input type="text"	A text box.
option	An option in a SELECT element.
select	A listbox; can also be a drop-down list box.
textarea	Multiline text box.

Password elements hide the password on the client side by using *s. The password is sent in plain text withno encryption.

Example


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
  <body> /*  w  w  w.  j  a v  a 2s  .  com*/
    <form action="index.php" method="get"> 
        <label for="textField">A text input field</label> 
        <input type="text" name="textField" id="textField" value="" /> 
        <label for="passwordField">A password field</label> 
        <input type="password" name="passwordField" id="passwordField" value="" /> 
        <label for="checkboxField">A checkbox field</label> 
        <input type="checkbox" name="checkboxField" id="checkboxField" value="yes" /> 
        <label for="radioButtonField1">A radio button field</label> 
        <input type="radio" name="radioButtonField" id="radioButtonField1" value="radio1" /> 
        <label for="radioButtonField2">Another radio button</label> 
        <input type="radio" name="radioButtonField" id="radioButtonField2" value="radio2" /> 
        <label for="submitButton">A submit button</label> 
        <input type="submit" name="submitButton" id="submitButton" value="Submit Form" /> 
        <label for="resetButton">A reset button</label> 
        <input type="reset" name="resetButton" id="resetButton"  value="Reset Form" /> 
        <label for="fileSelectField">A file select field</label> 
        <input type="file" name="fileSelectField" id="fileSelectField" value="" /> 
        <label for="hiddenField">A hidden field</label> 
        <input type="hidden" name="hiddenField" id="hiddenField" value="" /> 
        <label for="imageField">An image field</label> 
        <input type="image" name="imageField" id="imageField" value="" src="asterisk.gif" width="23" height="23" /> 
        <label for="pushButton">A push button</label> 
        <input type="button" name="pushButton" id="pushButton"  value="Click Me" /> 
        <label for="pullDownMenu">A pull-down menu</label> 
        <select name="pullDownMenu" id="pullDownMenu" size="1"> 
          <option value="option1">Option 1</option> 
          <option value="option2">Option 2</option> 
          <option value="option3">Option 3</option> 
        </select> 
        <label for="listBox">A list box</label> 
        <select name="listBox" id="listBox" size="3"> 
          <option value="option1">Option 1</option> 
          <option value="option2">Option 2</option> 
          <option value="option3">Option 3</option> 
        </select> 
        <label for="multiListBox">A multi-select list box</label> 
        <select name="multiListBox" id="multiListBox" size="3" multiple="multiple"> 
          <option value="option1">Option 1</option> 
          <option value="option2">Option 2</option> 
          <option value="option3">Option 3</option> 
        </select> 
        <label for="textAreaField">A text area field</label> 
        <textarea name="textAreaField" id="textAreaField" rows="4" cols="50"></textarea> 

    </form> 
  </body> 
</html>

Form is created with the get method. This means that the form field names and values will be sent to the server in the URL. Meanwhile, the empty action attribute tells the browser to send the form back to the same page.

Field names and field values as being similar to the keys and values of an associative array.

Most controls are also given an associated label element. This text describes the field to the users. Each label is associated with its control using its for attribute, which matches the corresponding id attribute in the control element.

Home »
PHP Tutorial »
Form »

PHP Form Elements

Form Element List

Example

PHP Form

Form Demo