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: 
after select first selectonemenu, second 1 collaped. here html code element: 
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
Post a Comment