tabview IDを変更するJSFのタブビューとデータテーブルの更新属性

Question

3つのタブを持つtabViewがあります。各タブにはpanelGridとdataTableがあります。私はpanelGridからdataTableにレコードを追加したいと思います私は、次のタブに移動するtabViewと2番目のタブで同じ、これはうまく行くが、私の問題は、dataTableからレコードを選択するとき私は選択された同じ情報にpanelGridを変更したい次のタブに移動してそこの情報を編集すると、新しいレコードを追加したときにのみタブが次のタブに移動しますが、データテーブルから別のデータを選択して次のタブに移動しないと、私が間違っていることを理解することはできません。ここで

は私のタブコードです：

<h:form id="frmExamBank" widgetVar="accordionPanelWidget"> 
     <p:tabView widgetVar="tabWidget" id="tabsId" 
      activeIndex="#{mbCoursesExamBank.activeIndexTab}"> 
      <p:tab title="Course Exam Bank" id="tab1"> 
       <ui:include src="/pages/instructors/test.xhtml" /> 
      </p:tab> 
      <p:tab title="Course Exam Questions" id="tab2" disabled="true"> 
       <ui:include src="/pages/instructors/questions.xhtml" /> 
      </p:tab> 
      <p:tab title="Course Exam Answers" id="tab3" disabled="true"> 
       <ui:include src="/pages/instructors/answers.xhtml" /> 
      </p:tab> 
     </p:tabView> 
    </h:form> 

そして、ここでは私のpanelGridです：

<p:panelGrid columns="4" id="pnlCoursesExamBankData"> 
     <f:facet name="header"> 
      <div align="center">#{msg2.get('course_exam_bank')}</div> 
     </f:facet> 

     <p:outputLabel value="#{msg2.get('course')}" for="course" /> 
     <p:selectOneMenu id="course" value="#{mbCoursesExamBank.entity.course}" 
      required="true" converter="omnifaces.SelectItemsIndexConverter" 
      label="#{msg2.get('course')}" filter="true" filterMatchMode="contains"> 
      <f:selectItems value="#{mbCourses.all}" var="course" 
       itemLabel="#{course.fullName}" itemValue="#{course}" /> 
     </p:selectOneMenu> 

     <p:outputLabel value="#{msg2.get('exam_category')}" for="examCategory" /> 
     <p:selectOneMenu id="examCategory" 
      value="#{mbCoursesExamBank.entity.examCatogory}" required="true" 
      converter="omnifaces.SelectItemsIndexConverter" 
      label="#{msg2.get('exam_category')}"> 
      <f:selectItem itemLabel="#{msg2.get('select_category')}" 
       itemValue="#{null}" noSelectionOption="true" /> 
      <f:selectItems value="#{mbExamCategory.all}" var="category" 
       itemLabel="#{category.name}" itemValue="#{category}" /> 
     </p:selectOneMenu> 

     <f:facet name="footer"> 
      <div align="center"> 
       <p:commandButton value="#{msg2.get('add')}" 
        action="#{mbCoursesExamBank.addCoursesExamBank()}" 
        update="@parent,@parent:tblCoursesExamBank,frmExamBank:tabsId" 
        process="@parent:pnlCoursesExamBankData" icon="btn-icon fa fa-plus" /> 
       <p:commandButton value="#{msg2.get('save')}" 
        action="#{mbCoursesExamBank.update()}" 
        update="@parent,@parent:tblCoursesExamBank" 
        process="@parent:pnlCoursesExamBankData" 
        icon="btn-icon fa fa-floppy-o" /> 
       <p:commandButton value="#{msg2.get('delete')}" 
        action="#{mbCoursesExamBank.delete()}" 
        update="@parent,@parent:tblCoursesExamBank" 
        process="@parent:pnlCoursesExamBankData" 
        icon="btn-icon fa fa-pencil" /> 

      </div> 
     </f:facet> 
    </p:panelGrid> 

ここに私のdataTableさ：

<p:dataTable paginatorPosition="bottom" id="tblCoursesExamBank" 
     value="#{mbCoursesExamBank.all}" var="bank" selectionMode="single" 
     selection="#{mbCoursesExamBank.entity}" rowKey="#{bank.id}" 
     rowIndexVar="rowIndex" paginator="true" rows="6"> 
     <p:ajax event="rowSelect" 
      update="@parent:pnlCoursesExamBankData,frmExamBank,frmExamBank:tabsId" 
      process="@this" /> 
     <p:column headerText="#" width="10%"> 
          #{rowIndex+1} 
         </p:column> 
     <p:column headerText="#{msg2.get('course')}" 
      filterBy="#{bank.course.name}" sortBy="#{bank.course.name}" 
      filterMatchMode="contains"> 
         #{bank.course.name} 
         </p:column> 
     <p:column headerText="#{msg2.get('exam_catogory')}" 
      filterBy="#{bank.examCatogory.name}" 
      sortBy="#{bank.examCatogory.name}" filterMatchMode="contains"> 
         #{bank.examCatogory.name} 
         </p:column> 

    </p:dataTable> 

Answer 1

...私の問題があります私がを選択した場合レコードfr dataTableのオム...それは I は、タブは次 1に行くが、私は戻って行くときとそれが次へと移動していないのdataTable から別のデータを選択し新しいレコードを追加した場合にのみ、正常に動作しますタブ...

あなたが発見したように、同じビューで複数のプライムフェイスタブを使用することは非常に難しいことがあります。

複数のタブを選択する方法（複雑すぎるかもしれません）は、ページbeanでactionListenerを使用することです。あなたのケースでは、リスナーをデータテーブルイベントのrowSelectに関連付けることができます。 actionListenerで

、Primefaces法を使用してクライアントを呼び出す次のように関数名（selectTab）が実際に、クライアントコード内に存在しなければならないこと RequestContext.getCurrentInstance().execute("selectTab(desiredTabNumber)");

注

<script type="text/javascript"> 
    function selectTab(index) { 
     if(typeof tabWidget != 'undefined') { 
     tabWidget.select(index); 
     } else { 
     alert("Can't select tab " + index); 
     } 
    } 
</script> 

（以下

別の（たぶん信頼性の高い）アプローチは、複数のタブの間でモデルの状態を管理しようとしないことです同じぺージに。代わりに、多分一連のページを設定するためにJSF Flow Scopeを使用します。

のJavaServer Facesの機能を使用すると、スコープを持つページのセットを作成することができますFlowScoped、それはリクエストスコープより大きく、より少ない技術を顔フローセッションスコープたとえば、オンラインストアでチェックアウトプロセス用の一連のページを作成することができます。必要に応じてある店舗から別の店舗に転送することができる自己完結型の一連のページを作成することができます。