0

selectOneMenu に問題があります。ユース ケースは次のとおりです。最初の 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>

PrimeFaces ショーケースで説明したように、リスナーに関連付けられた af:ajax タグを使用して、最初の selectOneMenu が選択されたときに 2 番目の selectOneMenu の内容を更新します。

リスナー:

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());
}

そして、ここに奇妙な動作があります: 2つ目は崩壊しましたか?

最初の selectOneMenu を選択すると、2 番目の selectOneMenu が折りたたまれます。この要素の HTML コードは次のとおりです。 htmlコード

オプションが利用可能であることは明らかですが、それらは隠されています: 私<div class="ui-helper-hidden-accessible">は非常に奇妙だと思います.

この問題は 2 日間私を悩ませました。この種の問題の解決策はありますか?

前もって感謝します !!!!

4

1 に答える 1