HTML5: How to specify one or more forms the fieldset belongs to?

Last update on February 08 2024 12:47:58 (UTC/GMT +8 hours)

Solution:

HTML Code:

<!DOCTYPE html><!-- Document type declaration for HTML5 -->
<html><!-- Start of HTML document -->
<head><!-- Start of head section -->
<meta charset="utf-8"><!-- Metadata for specifying character encoding -->
<title>How to specify one or more forms the fieldset belongs to</title><!-- Title of the HTML document -->
</head><!-- End of head section -->
<body><!-- Start of body section -->
<form action="https://www.w3resource.com/html-css-exercise/basic/solution/fieldset-form-answer-demo.php" method="post" id="w3r_form"><!-- Start of form with action and method attributes -->
What is your favorite game? <input type="text" name="game"><br><!-- Text input field for favorite game -->
<input type="submit"><!-- Submit button -->
</form><!-- End of form -->
<fieldset form="w3r_form"><!-- Start of fieldset with form attribute referencing form by ID -->
<legend>Personal Info:</legend><!-- Legend for the fieldset -->
Name: <input type="text" name="name" /><br /><br /><!-- Input field for name -->
Email: <input type="text" name="email" /><br /><br /><!-- Input field for email -->
Place: <input type="text" name="place"/><br /><br /><!-- Input field for place -->
</fieldset><!-- End of fieldset -->
</body><!-- End of body section -->
</html><!-- End of HTML document -->

Explanation:

This HTML code demonstrates how to specify one or more forms the <fieldset> belongs to using the form attribute.
The document starts with the doctype declaration specifying that it is an HTML5 document.
Inside the <html> tags, the HTML document structure begins.
The <head> section contains metadata about the document, including the character encoding specified using the meta tag and the title of the document.
The <body> section is where the visible content of the webpage resides.
A <form> element is used to create a form with action and method attributes specifying where the form data should be sent and how it should be sent, respectively. The form also has an ID attribute set to "w3r_form" for identification purposes.
Inside the form, there is a text input field for the user to input their favorite game, followed by a submit button.
A <fieldset> element is used to group related form elements together. It has a form attribute set to "w3r_form", specifying that it belongs to the form with the ID "w3r_form".
Inside the fieldset, there is a legend indicating "Personal Info", followed by input fields for name, email, and place.
The HTML document ends with the closing </html> tag.<

Live Demo :

See the Pen fieldset-form-answer by w3resource (@w3resource) on CodePen.

See the solution in the browser

Supported browser


Yes	Yes	Yes	Yes	Yes

Go to Exercise page