Buttons

A button is an element of the interface to which you want to click. It is created as follows.

<Input type = "button" options>

The parameters of the button are listed in Table. 1.

Table. 1. Button options
Parameter Description
Name The name of the field. It is intended for the form handler to be able to identify this field. The name parameter can be omitted, in which case the button value is not passed to the server.
Value The inscription on the button, as well as its meaning.

The use of parameters and the creation of conventional buttons are shown in Example 1.

Example 1. Creating a button

Valid HTML
<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text / html; charset = windows-1251">
<Title> Button </ title>
</ Head>
<Body>
<Form action = "/ cgi-bin / handler.cgi">
<P style = "text-align: center"> <input type = "button" name = "press" value = "Press me gently"> </ p>
</ Form>
</ Body>
</ Html>

The result of this example is shown in Fig. 1.

Fig. 1

Fig. 1. Button appearance in the Opera browser

In the inscription on the button, you can put spaces in any number.

SUBMIT button

When the user clicks on this button, the form data is sent to the server and processed by the program specified by the action parameter of the <FORM> tag.

<Input type = "submit" options>

The parameters are the same as for simple buttons (example 2).

Example 2. Submit Button

Valid HTML
<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text / html; charset = windows-1251">
<Title> Button </ title>
</ Head>
<Body>
<Form action = "/ cgi-bin / handler.cgi">
<P> ... </ p>
<P> <input type = "submit" >> </ p>
</ Form>
</ Body>
</ Html>

The button is shown in Fig. 2.

Fig. 2

Fig. 2. Submit Button

The name parameter for this button type can be omitted. If you do not specify a value for the value parameter, the Query (for Internet Explorer), Submit (for Opera), or Send Request (for Firefox) automatically appears automatically .

RESET button

When you click this button, the form data is returned to its original value.

<Input type = "reset" options>

The parameters coincide with the parameters of simple buttons (example 3).

Example 3. Reset button

Valid HTML
<! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text / html; charset = windows-1251">
<Title> Button </ title>
</ Head>
<Body>
<Form action = "/ cgi-bin / handler.cgi">
<P> <input type = "text" size = "20"> <input type = "reset" > </ p>
</ Form>
</ Body>
</ Html>

The Reset button and its operation are shown below.

Fig. 3

Fig. 3. Reset button

Similarly to the Submit button, the value of the name parameter can be omitted, then the Reset button on the button will be automatically added by the browser.

The value of the Reset button is never sent to the server.

Copyright © www.htmlbook.ru