Learn how to use Password Fields, Radio buttons, Checkboxes etc. To make form in HTML. - Technology & Web designing

Breaking

Monday, 4 May 2020

Learn how to use Password Fields, Radio buttons, Checkboxes etc. To make form in HTML.


Password Field :

When user type in a text field of type PASSWORD then text entered is displayed as asterisk (*) or disc (•) sign.

<Input type="password"> defines a password field :

<Form>

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

</Form>

The above HTML code looks in a browser as follows :

Password :


Radio Buttons :

Radio button are something like toggle button and only one button can be selected at a time. If user selects a radio button from a group then all other become deselected. User can group RADIO buttons by giving them the same NAME but different VALUE. By default all radio buttons are deselected. User can control this status by defining CHECKED attribute the INPUT tag.

See the following example

<Form>

<Input type="radio" name="gender" value="male">Male<BR>

<Input type="radio" name="gender" value="female">Female

</Form>

The above HTML code looks like in a browser :

Male

Female


Checkboxes :

<Input type="checkbox"> creates a checkbox. Checkbox is used to select ONE or MORE options of a limited number of choices. Checked attribute will select the checkbox by default. Following code shows two checkbox. Using checked attribute, Tuesday checkbox selected by default.

<Form>

<Input type="checkbox" name="day">Monday<BR>

<Input type="checkbox" name="day">Tueday

</Form>

The above HTML code looks in a browser :

Monday

Tuesday


Submit button :

<Input type="submit"> defines a submit button. A submit button is used to send form data to a server for processing. The data is sent to the page specified in the form's action attribute.

Let's understand with an example

<Form>

<form name="xyz" action="html_form.asp" method="post">

Username : <input type="text" name="user">

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

</Form>

The above HTML code looks in a browser :

Username :

If user types some characters in the text field above, and click the "Submit" button, the browser will send user's input to a page called "html_form.asp. The page will display the received input.

Using the VALUE attribute user can change the lable of the buttons to user's choice . If user has not specified the value attribute, then Submit Query will be displayed by default.

Reset Button :

The RESET button usually used along with SUBMIT button resets the value of the form to its original states.

See the following example

Username : <input type="text" name="user">

<input type="reset" value="Reset">

The above HTML code looks in a browser :
Username :



No comments:

Post a Comment

If you have any doubts regarding this please comment or email us.