ICEfaces
  1. ICEfaces
  2. ICE-10721

ACE components built-in label rendering should use <label> element.

          Details

          • Type: Improvement Improvement
          • Status: Closed
          • Priority: Minor Minor
          • Resolution: Fixed
          • Affects Version/s: 4.0
          • Fix Version/s: 4.1
          • Component/s: ACE-Components
          • Labels:
            None
          • Environment:
            ICEfaces 4, ACE components
          • Assignee Priority:
            P2

            Description

            As of ICEfaces 4.0, the built-in label rendering feature of the ACE input components renders out the label text using a SPAN element. This improvement JIRA is to modify the renderers to instead use a LABEL element for label positions other than "in-field".

            The benefits of this change are that by using the <label> element the browser will automagically set the focus on to the corresponding input element when the label is clicked by the user (this may required further structural changes in the rendering of the component to work properly).

            Also, when a LABEL element is associated with an input element the input element will automatically use the label txt as the ARIA accessible name, so long as the input element itself is considered a labelable element. See http://www.w3.org/TR/aria-in-html/ for more information.

             

              Issue Links

              blocks

              Improvement - An improvement or enhancement to an existing feature or task. ICE-10693 ace:checkboxButton not selected when associated outputLabel is clicked

              • Major - Major loss of function.
              • Closed

                Activity

                Ascending order - Click to sort in descending order
                Hide
                Permalink
                Ken Fyten added a comment -

                Current label renderer generated markup:

                <span class="ui-input-label ui-input-label-left" id="label_textEntryForm:address1Input">Apt./Suite #</span>

                New label renderer generated markup:

                <label for="p:conditionIn" id="p:_t83">Item Condition:</label>
                Show
                Ken Fyten added a comment - Current label renderer generated markup: <span class= "ui-input-label ui-input-label-left" id= "label_textEntryForm:address1Input" >Apt./Suite #</span> New label renderer generated markup: <label for = "p:conditionIn" id= "p:_t83" >Item Condition:</label>
                Hide
                Permalink
                Arturo Zambrano added a comment -

                r44994: modified built-in labels to render <label> elements instead, which activate the main input fields of the components; in the case of ace:selectMenu, this had to be done via javascript, since it doesn't use labelable elements.

                Show
                Arturo Zambrano added a comment - r44994: modified built-in labels to render <label> elements instead, which activate the main input fields of the components; in the case of ace:selectMenu, this had to be done via javascript, since it doesn't use labelable elements.

                  People

                  • Assignee:
                    Arturo Zambrano
                    Reporter:
                    Ken Fyten
                  • Votes:
                    0 Vote for this issue
                    Watchers:
                    2 Start watching this issue

                    Dates

                    • Created:
                      Updated:
                      Resolved: