[whatwg] The legend element

Ian Hickson ian at hixie.ch
Tue Oct 13 03:14:55 PDT 2009


On Mon, 12 Oct 2009, Markus Ernst wrote:
>
> My use case is a template system with separate placeholders for labels 
> and input fields, where input fields can be fieldsets in some cases, 
> e.g.:
> 
> Relevant part of the template:
> 
> <!-- BEGIN form-fields-loop -->
> <tr>
>   <td><h2>{label}</h2></td>
>   <td>{input-html}</td>
> </tr>
> <!-- END form-fields-loop -->
>
> Placeholder outputs of first row:
> 
> {label}: <label for="q1">What is your name?</label>
> 
> {input-html}:
> <input id="q1" type="text" name="Name">
> 
> 
> Placeholder outputs of 2nd row:
> 
> {label}: <label for="q2">What is favourite pet?</label>
> 
> {input-html}:
> <fieldset id="q2">
>   <p><label><input type="radio" name="Pet" value="Cat">Cat</label></p>
>   <p><label><input type="radio" name="Pet" value="Dog">Dog</label></p>
>   <p><label><input type="radio" name="Pet" value="Ant">Ant</label></p>
> </fieldset>
> 
> 
> Placeholder outputs of 3rd row:
> 
> {label}: <label for="q3">When are you born?</label>
> 
> {input-html}:
> <fieldset id="q3">
>   <label>Month:
>     <select name="Month">
>       <option value="01">January</option>
>       ...
>     </select>
>   </label>
>   <label>Year: <input type="text" name="Year" size="4"></label>
> </fieldset>
> 
> 
> Rows 2 and 3 illustrate the use case. For my original suggestion replace
> <label> with <legend> in those rows.

Ah, I see.

I would recommend not using <label> and <fieldset> for rows 2 and 3.

As in:

  Placeholder outputs of 2nd row:

    {label}: What is favourite pet?

    {input-html}:
    <p><label><input type="radio" name="Pet" value="Cat">Cat</label></p>
    <p><label><input type="radio" name="Pet" value="Dog">Dog</label></p>
    <p><label><input type="radio" name="Pet" value="Ant">Ant</label></p>


  Placeholder outputs of 3rd row:

    {label}: When are you born?

    {input-html}:
    <label>Month:
     <select name="Month">
       <option value="01">January</option>
       ...
     </select>
    </label>
    <label>Year: <input type="text" name="Year" size="4"></label>

Why isn't that satisfactory?

-- 
Ian Hickson               U+1047E                )\._.,--....,'``.    fL
http://ln.hixie.ch/       U+263A                /,   _.. \   _\  ;`._ ,.
Things that are impossible just take longer.   `._.-(,_..'--(,_..'`-.;.'


More information about the whatwg mailing list