Primefacesセルの編集は、検証が失敗したときに編集モードのままにします

Aug 17 2020

編集可能= trueのp:dataTableセル編集とバリデーターで使用していp:selectOneMenuます。選択したp：selectOneMenu値または入力した値が無効な場合、セルの編集状態を編集モード（2番目のスクリーンショット）のままにし、通常のフォーム（3番目のスクリーンショット）を使用する場合と同じように、入力の周りに赤いボックスを表示します。検証が失敗すると、うなり声とメッセージが表示されますが、ドロップダウンの周りの赤いボックスは持続せず、ユーザーが気付かない可能性があります（最初のスクリーンショット）。赤いボックスを表示するためにajaxの更新を行う方法がわかりませんが、ドロップダウンと赤いボックスが引き続き表示されるように、セルを編集モードのままにします。

<p:dataTable id="table" value="#{bean.data}" var="lineItem" editable="true" editMode="cell">

<p:column headerText="* Account">
  <p:cellEditor>
    <f:facet name="output">
       <h:outputText value="#{lineItem.account}" />
    </f:facet>

    <f:facet name="input">
      <p:selectOneMenu id="so" value="#{lineItem.account}" editable="true" dynamic="true"  converter="omnifaces.SelectItemsConverter" title="Type an account or select a stored favorite" validator="com.gdeb.rozycki.app.acountValidator" >

      <f:selectItem noSelectionOption="true" itemLabel="---Favorites" itemValue="null" />
      <f:selectItems value="#{bean.favorites}" var="fav" itemLabel="#{fav.acctNum}" itemValue="#{fav}" />
                                            
      <p:ajax disabled="#{facesContext.validationFailed}" update="table growl messages" listener="#{bean.updateAccountInline(lineItem)}" />
      </p:selectOneMenu>
    </f:facet>
  </p:cellEditor>
</p:column>

このスクリーンショットは、アカウントをスペース付きで保存されたお気に入りに保存してみましたが、スペースはもう必要ありません。（はい、ユーザーがお気に入りのアカウント番号を保存するときにスペースを許可しない検証がありますが、実装する他の検証があります）検証が失敗すると、ヘッダーとうなり声のメッセージだけが表示されます。2番目のスクリーンショットに示すように、ドロップダウンをもう一度クリックするまで、赤いアウトラインは表示されません。

回答

jeff Sep 12 2020 at 01:31

ajax呼び出しは、データテーブルのIDを持っていたtableその中にupdate属性。そのClientIDを削除して削除しましたdisabled="#{facesContext.validationFailed}"

このcellEdit関数は、cellEditを実装しているコンポーネントClientIdを自動的に更新すると思います。したがって、ajaxタグで明示的に指定する必要もありません。