Jump to content

<fieldset> Misunderstanding


mattmill30
 Share

Recommended Posts

Hi,I was directed to the <fieldset> tag, by a validation software, and i'm not 100% sure how i can use it, and it tie in with the standard.If theres a white paper available, i'd be very greatful for a link.My question is:Can i use one <fieldset> tag, to contain, all sorts of input tags, aswell as select tags?Or is the <fieldset> tag, meant to group multiple input tags of the same type/name?e.g.Can i use <fieldset> here:

<form>	<fieldset>		<input id="input1" value="1" name="name"><label for="input1">1</label>		<input id="input2" value="2" name="name"><label for="input2">2</label>		<input id="input3" value="3" name="name"><label for="input3">3</label>	</fieldset></form>

and here:

<form>	<fieldset>		<select name="title">			<option value="mr">Mr</option>			<option value="mr">Mrs</option>			<option value="mr">Ms</option>			<option value="mr">Doc</option>			<option value="mr">Prof</option>		</select>		<input id="input_firstname_1" value="1" name="firstname" type="radio" /><label for="input_firstname_1">Andrew</label>		<input id="input_firstname_2" value="2" name="firstname" type="radio" /><label for="input_firstname_2">Phil</label>		<input id="input_firstname_3" value="3" name="firstname" type="radio" /><label for="input_firstname_3">Gerald</label>		<input id="input_middlename_1" value="1" name="middlename" type="checked" /><label for="input_middlename_1">Peter</label>		<input id="input_middlename_1" value="2" name="middlename" type="checked" /><label for="input_middlename_1">Luke</label>		<input id="input_middlename_1" value="3" name="middlename" type="checked" /><label for="input_middlename_1">Arnold</label>		<input id="input_surname" name="surname" type="text" value="type surname here" /><label for="input_surname">Surname:</label>	</fieldset></form>

TIAMatthew Millar

Link to comment
Share on other sites

Hi,Having read http://www.w3.org/TR/WCAG20-TECHS/H71.html.I've come to the conclusion that the <fieldset> is simply for presentation, and doesn't improve the performance of the page, or how the browser interprets it.Is this correct?From the link above, it seems to indicate that the fieldset is used alot by assistive technologies, and is designed to make form contents easier for the user to digest.So i can wrap both above examples in <fieldset> and it still meet the standard.

Link to comment
Share on other sites

Because fieldset has semantic value, I find it useful for scripting also.If you have a big, complicated form, that means you'll have a lot of inputs of various types. Now imagine you want to validate a group of related checkboxes. The normal way is to get a collection of ALL the inputs in the form, loop through them, and then test for a property like type or name. That extra test just annoys me.Now imagine that a group of related checkboxes is contained by a fieldset. This is a semantically legitimate arrangement to have, since the inputs are all related. It also helps your script. You can get a collection of all the inputs in the fieldset, and you'll KNOW that they are the checkboxes you want to validate, and ONLY those checkboxes. Your script doesn't have to test for type or name before using them. So you can save yourself a step or two in your script, and your code is cleaner.If you don't like the border around the fieldset, you can turn it off in CSS. When you do that, the purpose of the fieldset is primarily semantic.

Link to comment
Share on other sites

Hi,Thanks for the replies.So other than for scripts, how does the <fieldset> help the browser?Because i couldn't think of a logical purpose for it, if the different form items are grouped by the name attribute.Also, in the example above, i've contained multiple form elements, with different names, within one fieldset element, can this be done, and still being semantically correct?Am i correct in thinking that the purpose of the fieldset element, is literally to act as a grouping element for multiple form elements?Thanks,Matthew Millar

Link to comment
Share on other sites

You are correct. The added bonus of fieldsets is that it aids accessibility. I am always banging on about accessibility because of the way I learned to code. If someone can't see, they don't really grasp as easily what your form is form. If there is a fieldset with a relevant and concise label, it tells someone who can't take in your page as you do, what they're filling in their details for.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...