- Trending Categories
- Data Structure
- Operating System
- C Programming
- Social Studies
- Fashion Studies
- Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to specify which form element a calculation is bound to with HTML?
The HTML label tag enables us to click on the label, which will be treated as if we had clicked on the appropriate input type. The HTML can accept several input kinds, such as a radio button or checkbox. The for attribute provides the form element to which a label is bound.
<label for="element_id"> Label Content </label>
Following are the examples…
In the following example if we click on the student the respected radio button will be selected,increasing the selection area.this is done with the help of for attribute.
<!DOCTYPE html> <html> <body> <h1>Click On Labels To Select Radio Button</h1> <form> <label for="Student">Student</label> <input type="radio" name="Category" id="Student" value="Student" /> <br /> <label for="WorkingProfessional"> Working Professional </label> <input type="radio" name="Category" id="WorkingProfessional" value="WorkingProfessional"/> <br /> <label for="Retired">Retired</label> <input type="radio" name="Category" id="Retired" value="Retired" /> <br /> <br /> <input type="submit" value="Submit" /> </form> </body> </html>
When the script gets executed, the window will open in a browser with different labels, each containing a radio button in front of them to increase their selection area when selected.
Another example using the for attribute can be seen as follows −
<!DOCTYPE html> <html> <body> <p>Education:</p> <form action=""> <label for = "graduate">Graduate</label> <input type = "radio" name = "education" id = "graduate" value = "graduate"><br> <label for = "ugraduate">Under-graduate</label> <input type = "radio" name = "education" id = "ugraduate" value = "ugraduate"><br> <input type = "submit" value = "Submit"> </form> </body> </html>
On executing the script above, the output achieved is as follows −
- How to specify where to send the form-data when a form is submitted in HTML?
- How to specify that the element is read-only in HTML?
- How to specify that the element must be filled out before submitting the form in HTML?
- How to specify a unique id for an element in HTML?
- How to specify that an element is not yet relevant in HTML?
- How to specify whether the form-data should be encoded while submitting to the server with HTML?
- How to specify the HTTP method to use when sending form-data in HTML?
- How to specify a minimum value in HTML?
- How to specify citation in HTML?
- How to specify the language of the element's content in HTML?
- How to specify that the form should not be validated when disabled in HTML?
- How to specify whether the element is to have its spelling and grammar checked or not in HTML?
- How to specify whether the or the element should have autocomplete enabled in HTML?
- How to specify the type of box used for an HTML element using CSS?
- How to create a signup form with HTML and CSS?