jquery - Primefaces Two selectOneMenu, after selecting the first one, the second collapsed -


i have problem on selectonemenu, use case is: first selectonemenu selecting brands of auto, bmw, benz, etc. second selectonemenu selecing concrete type, if first bmw, concrete types "320i, 520i.."

here snippet of jsf:

<p:row>     <p:column>         <h:outputlabel for="search_car_brand" value="brand: " />     </p:column>     <p:column>         <p:selectonemenu value="#{carcontroller.carsearchdto.brand}"             converter="brandconverter" effect="fade" id="search_car_brand"             filter="true" filtermatchmode="startswith" height="200">             <f:selectitem itemlabel="please select brand..." itemvalue="" />             <f:selectitems value="#{constants.availablebrands}"                 var="carbrand" itemlabel="#{carbrand.key}"                 itemvalue="#{carbrand.value}" />             <p:ajax update="search_car_type"                 listener="#{carcontroller.handlesearchbrandchange}" />         </p:selectonemenu>     </p:column>     <p:column>         <h:outputlabel for="search_car_type" value="type: " />     </p:column>     <p:column>         <p:selectonemenu value="#{carcontroller.carsearchdto.type}"             converter="typeconverter" effect="fade" id="search_car_type"             filter="true" filtermatchmode="startswith" height="200">             <f:selectitem itemlabel="please select type..." itemvalue="" />             <f:selectitems                 value="#{carcontroller.activatedcartypesforsearch}"                 var="cartype" itemlabel="#{cartype.name}"                 itemvalue="#{cartype}" />         </p:selectonemenu>         <p:message for="search_car_type" />     </p:column> </p:row> 

as primefaces showcase taught, use f:ajax tag associated listener update contents of second selectonemenu when first 1 selected.

the listener:

public void handlesearchbrandchange() {     // retrieve brand selected dto     if (carsearchdto.getbrand() == null) {         activatedcartypesforsearch = null;         return;     }      logger.info(string.format("[search] brand changed to: %s", carsearchdto             .getbrand().getname()));     brand selectedbrand = carsearchdto.getbrand();     activatedcartypesforsearch = constants.getavailablecartypes().get(             selectedbrand.getname()); } 

and here strange behavior: the second 1 has collapsed ?

after select first selectonemenu, second 1 collaped. here html code element: html code

it options available, hidden: think <div class="ui-helper-hidden-accessible"> quite strange, may block options showing ?

this problem has troubled me 2 days. solutions kind of problem ?

thanks in advance !!!!

i had same issue, solved setting css width property of selectonemenu:

<p:selectonemenu style="width:125px;"... 

Comments

Popular posts from this blog

How to remove text and logo OR add Overflow on Android ActionBar using AppCompat on API 8? -

html - How to style widget with post count different than without post count -

url rewriting - How to redirect a http POST with urlrewritefilter -