HTML form

Forms are an important external form for implementing dynamic web pages.

Forms and form fields do not have the ability to be typed. The production of form web pages must ultimately be organized by tables.

html form is an important means for interaction between html page and browser. Forms can be used to collect relevant information submitted by clients.


When browsing a website, you often encounter forms. It is an important part of the website to achieve interactive functions. No matter what form of language the website uses to realize the interactive functions of the website, such as ASP, PHP, JSP, forms have become their unified external form.


HTML form (Form) is an important part of HTML. Its main function is to collect information, specifically to collect visitor information.

There are three key points to master when learning HTML forms (Form):

·       Form Controls (Form Controls)

·          Action

·        Method

Let’s talk about form controls first. Through various controls of HTML forms, users can enter text information, select from options, and submit operation. For example, in the above example sentence, input type="text" is a form control, representing a single-line input box.

The information filled in by the user always needs to be processed by the program. The action in the form specifies the file that processes the form information. As for method, it represents the way to send form information. method has two values: get and post. The get method is to encode the name/value information of the form control and send it through the URL (you can see it in the address bar). Post sends the form content through http, and you cannot see the form submission information in the address bar. So when to use get and when to use post? Generally, it is judged this way. If it is just to obtain and display data, use get; once it involves saving and updating data, it is recommended to use post.

HTML Form (Form) Commonly Used Controls (Controls)

HTML Form (Form) Commonly Used Controls Are:


Form Controls (Form Controls) Description

input type="text" Single-line text input box

input type="submit" Submit the information in the form to the file pointed to by the action in the form

input type="checkbox" Checkbox

input type="radio" Radio button

select #   textArea                                                                                                                                                                         )

Form Control: Single-line text input box (input type="text")

Single-line text input Box allows the user to enter some brief one-line information, such as the user's name. Example sentences are as follows:

<input type="text" name="yourname">

Form Control ): Checkbox (input type="checkbox")

The checkbox allows the user to select multiple options from a set of options. Sample code:

<input type="checkbox" name="fruit" value ="apple">Apple<br>

<input type="checkbox" name="fruit" value ="orange">orange<br>
<input type="checkbox" name="fruit" value ="mango">mango<br>


Use checked to indicate the options that are selected by default.

<input type="checkbox" name="fruit" value ="orange" checked>orange<br>




##Form Control: Radio Button (input type="radio")

Use radio button boxes to allow users to select only one option from a set of options. Sample code: <input type="radio" name="fruit" value = "Apple">Apple<br>

<input type="radio" name="fruit" value = "Orange">orange<br>

<input type="radio" name="fruit" value = "Mango">Mango<br>


Use checked to indicate the options that are selected by default.

<input type="radio" name="fruit" value = "Orange" checked>orange<br>




##Form Control: Drop-down box (select)


The drop-down box (Select) can be used for both radio selection and check selection. Single-choice example sentences are as follows:

<select name="fruit" >
<option value="apple">Apple
<option value="orange">orange
<option value=" mango">Mango
</select>

If you want to change it to a check selection, just add muiltiple. Users use Ctrl to implement multiple selections. Example:

<select name="fruit" multiple>

Users can also use the size attribute to change the size of the drop-down box (Select).


Form Control: Multi-line input box (textarea)

Multi-line input box (textarea) ) is mainly used to enter longer text messages. An example sentence is as follows:

<textarea name="yoursuggest" cols ="50" rows = "3"></textarea>

where cols represents the width of textarea, rows represents the height of textarea.


Form Control: Password input box (input type="password")

Password input box (input type="password") is mainly used to enter some confidential information, such as passwords. Because when the user inputs, what is displayed is not the input content, but the black dot symbol. . Example sentences are as follows:

<input type="password" name="yourpw">


##Form Control ): Submit (input type="submit")

By submitting (input type=submit), the information in the form (Form) can be submitted to the file pointed to by the action in the form. An example sentence is as follows:

<input type="submit" value="submit">



Which page should the form in the page be submitted to? It is set by the action attribute.

Then click the <input type="submit"> button to be transferred to the corresponding page

You can also click the <input type="button"> button Add the onClick event to reset the action attribute value of the form form through js code to go to a different page.


Continuing Learning
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php.cn</title> </head> <body> <form action=""> 户名: <input type="text" name="user"><br><br> 密码: <input type="password" name="password"> <hr> <input type="radio" name="sex" value="male">Male <input type="radio" name="sex" value="female">Female <hr> <input type="checkbox" name="vehicle" value="Bike">bike <input type="checkbox" name="vehicle" value="Car">car <input type="checkbox" name="vehicle" value="moto">moto <hr> <select name="cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat" selected>Fiat</option> <option value="audi">Audi</option> </select> <hr> <textarea rows="10" cols="30"> 文本框。 </textarea> <br> <input type="submit" value="提交"> </form> </body> </html>
submitReset Code
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!