0

我在selectOneMenu上有一个问题,用例是:第一个selectOneMenu用于选择汽车品牌,如BMW,Benz等。第二个selectOneMenu用于选择具体类型,如果第一个是BMW,那么具体类型是类似“320i, 520i..”

这是我的 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 a 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 a 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 the PrimeFaces showcase taught, I use af:ajax tag associated with a listener to update the contents of the second selectOneMenu when the first one is selected.

听者:

public void handleSearchBrandChange() {
    // retrieve the brand selected from the 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());
}

这是奇怪的行为: 第二个倒塌了?

在我选择第一个 selectOneMenu 后,第二个被折叠。这是该元素的 HTML 代码: html代码

很明显,选项是可用的,但它们是隐藏的:我觉得<div class="ui-helper-hidden-accessible">很奇怪,它可能会阻止选项显示?

这个问题困扰了我两天。此类问题的任何解决方案?

提前致谢 !!!!

4

1 回答 1

0

我有同样的问题,通过设置selectOneMenu的css宽度属性解决:

<p:selectOneMenu style="width:125px;"...
于 2013-09-04T18:31:02.830 回答