Hover/Focus applied incorrectly to selectOneMenu

UI Components for JSF
Post Reply
porthos
Posts: 122
Joined: 09 May 2011, 03:17

03 Dec 2011, 04:50

ui-state-hover and ui-state-focus are currently not being applied correctly to selectOneMenu widgets. With the result that the borders of the widget are drawn with incorrect colours.

To increase visibility of the problem, I've changed border colour to Red for both focus and hover on the Showcase. Notice that the button border has the correct border colour, but on the selectOneMenu only the inner border of the trigger button is coloured.

Image

The reason is that the focus and hover style classes are applied to the trigger button and the label element only, but not to the <div> element enclosing the entire widget.

Code: Select all

<div class="ui-selectonemenu ui-widget ui-state-default ui-corner-all ui-helper-clearfix" id="j_idt44:j_idt61"
     style="width: 165px;">
  <div class="ui-helper-hidden"><select name="j_idt44:j_idt61_input" id="j_idt44:j_idt61_input">...</select></div>
  <a class="ui-selectonemenu-label-container" href="#">
    <label class="ui-selectonemenu-label ui-corner-all ui-state-focus">Select One</label>
  </a>

  <div class="ui-selectonemenu-trigger ui-state-default ui-corner-right ui-state-focus">
    <span class="ui-icon ui-icon-triangle-1-s"></span>
  </div>
</div>
I believe that applying focus and hover to the inner <label> element is actually incorrect, because in default state the label element has no background - the background behid the label is supplied by the outer div for the widget. But when focus class is applied, background behind the label now comes from the label element's focus class, no longer the outer div.

Correct behaviour would be to apply the focus and hover classes to the outer <div> and the trigger <div> only, not to the label. I've tested that. It renders correctly.
-------
PrimeFaces 3.4, Glassfish 3.1.2, Mojarra 2.1.6

porthos
Posts: 122
Joined: 09 May 2011, 03:17

03 Dec 2011, 18:41

Opened an issue for this: http://code.google.com/p/primefaces/iss ... il?id=2968

Let us know if the problem affects components other than selectOneMenu. Chances are it does, but I haven't tested any of the other new selectXXX components yet.
-------
PrimeFaces 3.4, Glassfish 3.1.2, Mojarra 2.1.6

Post Reply

Return to “PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 19 guests