Stripes

<stripes:label tag doesn't correspond the label to the data control like it should

Details

  • Type: Bug Bug
  • Status: Closed Closed
  • Priority: Minor Minor
  • Resolution: Not a Bug
  • Affects Version/s: Release 1.4.2
  • Fix Version/s: None
  • Component/s: Tag Library
  • Labels:
    None

Description

Here's the html label tag:

<input type="radio" name="choiceID" id="answer1" value="2" />
<label for="answer1"> Spiderman</label>

One of the neat things about using the label tag is that when you click on the label associated with the radio button, the radio button gets clicked. Notice that the label/for matches up with the radio/id.

Here's the stripes label tag:

<stripes:radio name="testA" value="0" />
<stripes:label for="testA">Test A: </stripes:label>

Here's the html generated by the stripes label tag:

<input value="0" type="radio" name="testA" />
<label class="null" for="testA">Test A: </label>

Notice that the label/for does NOT match up with the radio/id.

In the example, the label/for value SHOULD match up with the radio/id value. Because it does not (it doesn't even have an id in this particular example), clicking on the label does not select the radio button like it should.

P.S. And <label class="null" seems like a bug, to.

Activity

Hide
Will Gayther added a comment - 08/Feb/07 5:40 PM

On the mailing list, Paul Barry wrote:

You have to supply the id yourself, because ID has to be unique on a page, whereas name will not be. Examples:

<input id="testA0" value="0" type="radio" name="testA" />
<label id="testA0" class="null" for="testA">Test A: </label>
<input id="testA1" value="1" type="radio" name="testA" />
<label id="testA1" class="null" for="testA">Test A: </label>

Show
Will Gayther added a comment - 08/Feb/07 5:40 PM On the mailing list, Paul Barry wrote: You have to supply the id yourself, because ID has to be unique on a page, whereas name will not be. Examples: <input id="testA0" value="0" type="radio" name="testA" /> <label id="testA0" class="null" for="testA">Test A: </label> <input id="testA1" value="1" type="radio" name="testA" /> <label id="testA1" class="null" for="testA">Test A: </label>
Hide
Will Gayther added a comment - 08/Feb/07 5:40 PM

I responded with:

Paul,

Thanks for writing back.

Just to make sure I'm clear, with the label tag:
"The "for" attribute binds a label to another element. Set the value of the "for" attribute equal to the value of the "id" attribute of the related element."

But Stripes instead matches the "for" attribute with the "name" attribute - which doesn't do anything at all, as far as I know. It's not ok to match them up instead, because it doesn't do anything.

From w3.org:
http://www.w3.org/TR/WCAG10-HTML-TECHS/#forms-labels

Another example:
http://www.w3schools.com/tags/tag_label.asp

Now, you mentioned the thing about the id having to be unique. Well, Stripes already generates an id attribute if there isn't one for certain fields. For example, this is code from what I'm working on right now:

<stripes:form beanclass="aftectest.stripes.LoginStudentActionBean" focus="">
<stripes:errors />

<stripes:label for="userID">User ID: </stripes:label>
<stripes:text name="userID" /> <stripes:submit name="login" value="Login"/>
</stripes:form>

And this is what's generated:
<form action="/LoginStudent.action" method="post">
<label for="userID">User ID: </label>
<input type="text" name="userID" id="-1203751408" /><script type="text/javascript">var z=document.getElementById('-1203751408'); try{z.focus();z.select();} catch(e) {}</script> <input value="Login" type="submit" name="login" />
<div style="display: none;"><input type="hidden" name="sourcePage" value="/StudentLogin.jsp" /><input type="hidden" name="_fp" value="7BF4MOgnm6gGlhqRVR7TrQ==" /></div></form>

Notice this line:
<input type="text" name="userID" id="-1203751408" />

Even though I didn't specify an id, stripes generated one for me. If it can generate an id when I don't supply one in some cases, wouldn't it make sense for it to generate one to correctly tie the label and input tags together?

Show
Will Gayther added a comment - 08/Feb/07 5:40 PM I responded with: Paul, Thanks for writing back. Just to make sure I'm clear, with the label tag: "The "for" attribute binds a label to another element. Set the value of the "for" attribute equal to the value of the "id" attribute of the related element." But Stripes instead matches the "for" attribute with the "name" attribute - which doesn't do anything at all, as far as I know. It's not ok to match them up instead, because it doesn't do anything. From w3.org: http://www.w3.org/TR/WCAG10-HTML-TECHS/#forms-labels Another example: http://www.w3schools.com/tags/tag_label.asp Now, you mentioned the thing about the id having to be unique. Well, Stripes already generates an id attribute if there isn't one for certain fields. For example, this is code from what I'm working on right now: <stripes:form beanclass="aftectest.stripes.LoginStudentActionBean" focus=""> <stripes:errors /> <stripes:label for="userID">User ID: </stripes:label> <stripes:text name="userID" /> <stripes:submit name="login" value="Login"/> </stripes:form> And this is what's generated: <form action="/LoginStudent.action" method="post"> <label for="userID">User ID: </label> <input type="text" name="userID" id="-1203751408" /><script type="text/javascript">var z=document.getElementById('-1203751408'); try{z.focus();z.select();} catch(e) {}</script> <input value="Login" type="submit" name="login" /> <div style="display: none;"><input type="hidden" name="sourcePage" value="/StudentLogin.jsp" /><input type="hidden" name="_fp" value="7BF4MOgnm6gGlhqRVR7TrQ==" /></div></form> Notice this line: <input type="text" name="userID" id="-1203751408" /> Even though I didn't specify an id, stripes generated one for me. If it can generate an id when I don't supply one in some cases, wouldn't it make sense for it to generate one to correctly tie the label and input tags together?
Hide
Frederic Daoud added a comment - 19/Apr/11 3:37 PM

Supply the id to tie to your label.

Show
Frederic Daoud added a comment - 19/Apr/11 3:37 PM Supply the id to tie to your label.

People

Vote (1)
Watch (0)

Dates

  • Created:
    03/Feb/07 1:39 PM
    Updated:
    19/Apr/11 3:37 PM
    Resolved:
    19/Apr/11 3:37 PM