3

最近、OmniFaces Ajax.updateColumn()に関する私の質問に次のように回答しました。

p:ajaxを介してOmniFaces Ajax.updateColumn()またはAjax.updateRow()を使用する方法

その場合、dataTableはJSF標準のh:dataTableであり、それはうまく機能しました。

さて、この場合、エンドユーザーがp:dataTableの外部に存在するp:calendarコンポーネントを介して日付を選択したときに、PrimeFaces p:dataTableを更新しようとしています。p:dataTablexhtmlは次のとおりです。

<p:dataTable id="flightDataTable" var="flight" 
             value="#{pf_flightController.flightsForOrder}">

    <p:column headerText="Airport" style="text-align: center !important;">
        <p:inputText value="#{flight.airportTx}" maxlength="25" size="10" label="Airport"/>
    </p:column>

    <p:column headerText="Airline" style="text-align: center !important;">
        <p:inputText value="#{flight.airlineTx}" maxlength="25" size="10" label="Airline"/>
    </p:column>

    <p:column headerText="Flight Number" style="text-align: center !important;">
        <p:inputText value="#{flight.flightNumber}" maxlength="8" size="10" label="Flight Number"/>
    </p:column>

    <p:column headerText="Type" style="text-align: center !important;">
        <h:selectOneMenu value="#{flight.flightType}" label="Flight Type">
            <f:selectItem itemValue="#{bundle.DropdownOptionValueArrive}" itemLabel="#{bundle.DropdownOptionLabelArrive}"/>
            <f:selectItem itemValue="#{bundle.DropdownOptionValueDepart}" itemLabel="#{bundle.DropdownOptionLabelDepart}"/>
        </h:selectOneMenu>
    </p:column>

    <p:column headerText="Date" style="text-align: center !important;">
        <h:panelGroup rendered="#{pf_usersController.loggedInViaAndroid == 'N'}">
            <p:calendar value="#{flight.flightDate}" navigator="true"
                        label="Flight Date"
                        pattern="MM/dd/yyyy" size="10">
                <f:convertDateTime pattern="MM/dd/yyyy" />
            </p:calendar>
        </h:panelGroup>
        <h:panelGroup rendered="#{pf_usersController.loggedInViaAndroid == 'Y'}">
            <p:inputText value="#{flight.flightDate}"
                         label="Flight Date" type="date">
                <f:convertDateTime pattern="yyyy-MM-dd" />
            </p:inputText>
        </h:panelGroup>
    </p:column>

    <p:column headerText="Time" style="text-align: center !important;">
        <h:panelGroup rendered="#{pf_usersController.loggedInViaAndroid == 'N'}">
            <pe:timePicker value="#{flight.flightTime}"
                           label="Flight Time" mode="popup"
                           showPeriod="true" style="width: 80px;">
                <f:convertDateTime pattern="hh:mm a" />
            </pe:timePicker>
        </h:panelGroup>
        <h:panelGroup rendered="#{pf_usersController.loggedInViaAndroid == 'Y'}">
            <p:inputText value="#{flight.flightTime}"
                         label="Flight Time" type="time">
                <f:convertDateTime pattern="HH:mm" />
            </p:inputText>
        </h:panelGroup>
    </p:column>

</p:dataTable>

当初および現在本番環境にあるp:calendar p:ajax update = "..."は、フライトp:dataTable全体を更新するため、p:dataTableの日付列が正常に更新されます。壊れていない場合は修正しないでください。しかし、今日はこのコードとxhtmlを変更していたので、OmniFaces AjaxユーティリティのupdateColumn()を使用して、すべての「1つの」列のみを更新したいと思いました。このPrimeFacesp:dataTableの行。

以下は、エンドユーザーがp:calendarを介して日付を選択したときに実行されるコードフラグメントです。これは、OmniFaces AjaxユーティリティのupdateColumn()を呼び出すコードです。

private void updateFlightDateOnAdd() {
    flightController.updateFlightDateOnAdd(current.getTripDateTime());

    UIData flightsDataTable = null;
    try {
        flightsDataTable = (UIData) Components.findComponent(":orderAddForm:flightDataTable");
    } catch (Exception e) {
        System.out.println("pf_OrdersController.updateFlightDateOnAdd(): caught exception on Components.findComponent(...)");
    }
    if (flightsDataTable != null) {
        System.out.println("pf_OrdersController.updateFlightDateOnAdd(): Components.findComponent(...) found " + flightsDataTable.getClientId());
        Ajax.updateColumn(flightsDataTable, 4);
    }
    else {
        System.out.println("pf_OrdersController.updateFlightDateOnAdd(): Components.findComponent(...) returned null");
    }
}

以下はPOJOの定義です。

public class FlightForOrder {
    private Integer flightId;
    private String airportTx, airlineTx, flightNumber;
    private Character flightType;
    private Date flightDate, flightTime;

    public FlightForOrder() {

    }

    public Integer getFlightId() {
        return flightId;
    }

    public void setFlightId(Integer flightId) {
        this.flightId = flightId;
    }

    public String getAirportTx() {
        return airportTx;
    }

    public void setAirportTx(String airportTx) {
        this.airportTx = airportTx;
    }

    public String getAirlineTx() {
        return airlineTx;
    }

    public void setAirlineTx(String airlineTx) {
        this.airlineTx = airlineTx;
    }

    public Date getFlightDate() {
        return flightDate;
    }

    public void setFlightDate(Date flightDate) {
        this.flightDate = flightDate;
    }

    public String getFlightNumber() {
        return flightNumber;
    }

    public void setFlightNumber(String flightNumber) {
        this.flightNumber = flightNumber;
    }

    public Date getFlightTime() {
        return flightTime;
    }

    public void setFlightTime(Date flightTime) {
        this.flightTime = flightTime;
    }

    public Character getFlightType() {
        return flightType;
    }

    public void setFlightType(Character flightType) {
        this.flightType = flightType;
    }

    @Override
    public int hashCode() {
        int hash = 3;
        hash = 97 * hash + Objects.hashCode(this.flightId);
        return hash;
    }

    @Override
    public boolean equals(Object obj) {
        if (obj == null) {
            return false;
        }
        if (getClass() != obj.getClass()) {
            return false;
        }
        final FlightForOrder other = (FlightForOrder) obj;
        if (!Objects.equals(this.flightId, other.flightId)) {
            return false;
        }
        return true;
    }

}

テスト中に、サーバーログに次の情報が表示されました。

INFO: pf_OrdersController.updateFlightDateOnAdd(): Components.findComponent(...) found orderAddForm:flightDataTable

つまり、PrimeFaces p:dataTableの適切な参照を取得したので、タイプUIDataのコンポーネントをAjax.updateColumn()に渡しました。

最終結果、PrimeFacesdataTableはOmniFacesAjaxユーティリティのupdateColumn()によって更新されませんでした。

Ajax.updateColumn(...)をコメントアウトし、update = "..."をp:calendar p:ajaxに再度追加すると、PrimeFacesdataTableが正常に更新されます。

PrimeFaces dataTableがAjax.updateColumn(...)を介して更新されるようにするために何をする必要があるかについてアドバイスしてください。ありがとう。

4

1 に答える 1

1

交換

<p:column headerText="Date" style="text-align: center !important;">
    <h:panelGroup rendered="#{pf_usersController.loggedInViaAndroid == 'N'}">
        <p:calendar value="#{flight.flightDate}" navigator="true"
                    label="Flight Date"
                    pattern="MM/dd/yyyy" size="10">
            <f:convertDateTime pattern="MM/dd/yyyy" />
        </p:calendar>
    </h:panelGroup>
    <h:panelGroup rendered="#{pf_usersController.loggedInViaAndroid == 'Y'}">
        <p:inputText value="#{flight.flightDate}"
                     label="Flight Date" type="date">
            <f:convertDateTime pattern="yyyy-MM-dd" />
        </p:inputText>
    </h:panelGroup>
</p:column>

<p:column headerText="Date" style="text-align: center !important;">
    <p:calendar value="#{flight.flightDate}" navigator="true"
                label="Flight Date"
                pattern="MM/dd/yyyy" size="10"
                rendered="#{pf_usersController.loggedInViaAndroid == 'N'}">
        <f:convertDateTime pattern="MM/dd/yyyy" />
    </p:calendar>
    <p:inputText value="#{flight.flightDate}"
                 label="Flight Date" type="date"
                 rendered="#{pf_usersController.loggedInViaAndroid == 'Y'}">
        <f:convertDateTime pattern="yyyy-MM-dd" />
    </p:inputText>
</p:column>

それを修正する必要があります。

説明:直接の子Ajax#updateColumn()のクライアントIDのみをに追加します。ただし、などの結果のHTML出力に含まれる属性がないaは、HTML出力に何もレンダリングしません。したがって、JS / Ajaxは、を更新するためにのHTML表現を見つけることができません。PartialViewContext#getRenderIds()<h:panelGroup>id<h:panelGroup>

この修正により、代わりにテーブルセルの具体的なコンテンツが直接の子になり、このようにしてJS/Ajaxがそれらを見つけて置き換えることができるようになります。別の方法は、これらのパネルグループに具体的なものを与えることですidが、この構成では不要です。

于 2012-10-30T00:44:39.917 に答える