The checkbox is shown as a square box that is ticked (checked) when activated.Checkboxes are used to let a user select one or more options of a limited number of choices. In HTML, User can create a checkbox using the <input> tag with the type attribute set to "checkbox". Here’s the basic syntax for creating a checkbox.
Code:-
<!DOCTYPE html>
<html>
<body>
<h1>Show Checkboxes</h1>
<form action=”/action_page.php”>
<input type=”checkbox” id=”vehicle1″ name=”vehicle1″ value=”Bike”>
<label for=”vehicle1″> I have a bike</label><br>
<input type=”checkbox” id=”vehicle2″ name=”vehicle2″ value=”Car”>
<label for=”vehicle2″> I have a car</label><br>
<input type=”checkbox” id=”vehicle3″ name=”vehicle3″ value=”Boat”>
<label for=”vehicle3″> I have a boat</label><br><br>
<input type=”submit” value=”Submit”>
</form>
</body>
</html>
Output:-
What is Html Radio Button?
The HTML is used to define a Radio Button. Radio Buttons are used to let the user select exactly one option from a list of predefined options. Radio Button input controls are created by using the “input” element with a type attribute having the value as “radio”.
The element may have additional attributes like name to group-related radio buttons and value to assign a specific value to the selected option.
Note: The “value” attribute in radio buttons assigns a distinct identifier for each option. While not visible to users, this value is sent to the server upon submission, helping identify the selected radio button.
Code Example :-
<HTML code for creating radio buttons>
<form>
<p>Please select your gender:</p>
<Each radio button has a name attribute with the same value, so they belong to the same group -->
<Each radio button has a value attribute that specifies the data to be sent to the server when the form is submitted>
<Each radio button has a label element that displays the text next to the button>
<input type="radio" id="male" name="gender" value="male">
<label for="male">Male</label><br>
<input type="radio" id="female" name="gender" value="female">
<label for="female">Female</label><br>
<input type="radio" id="other" name="gender" value="other">
<label for="other">Other</label>
</form>
</body>
</html>
Code Output :-
html select button ?
The element is used to create a drop-down list. The
element is most often used in a form, to collect user input.The name attribute is needed to reference the form data after the form is submitted (if you omit the name attribute, no data from the drop-down list will be submitted).The id attribute is needed to associate the drop-down list with a label.The tags inside the element define the available options in the drop-down list.
Certainly! In HTML, you can create a drop-down list using the <select> element. This is commonly used within forms to allow users to select a value from a list of options. Let me show you an example:
<label for="cars">Choose a car:</label>
<select name="cars" id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
In this example:
- The `<select>` element defines the drop-down list.
- The `<option>` tags inside the `<select>` element specify the available options.
- The `name` attribute is needed to reference the form data after submission.
- The `id` attribute associates the drop-down list with a label.
Anther example , You can also group options using `<optgroup>` tags if needed:
<label for="cars">Choose a car:</label>
<select name="cars" id="cars">
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
Define Html Hidden fields?
The <input type="hidden"> defines a hidden input field. A hidden field lets web developers include data that cannot be seen or modified by users when a form is submitted. A hidden field often stores what database record that needs to be updated when the form is submitted.
In HTML, A hidden input field is used to include data that cannot be seen or modified by users when a form is submitted. It's often employed to store information related to database records that need updating upon form submission.
Here's how you create a hidden input field using the `<input>` tag:
<input type="hidden" id="custId" name="custId" value="3487">
In this example:
- `type="hidden"` specifies that it's a hidden input field.
- `id` and `name` attributes provide identifiers for the field.
- `value` attribute holds the actual data you want to include (in this case, the value.