2013-05-16 21 views
6

İki sekme içeren bir sekme görünümüm var.Primefaces sekmesi: Etkin dizini sekme değiştirmeyi ayarlama

Sekme 1'den sekme 2'ye geçtiğimde, bir doğrulama gerçekleştiren ve bazı değerleri güncelleyen bazı kodları arıyorum. Bu doğrulamanın sonucuna bağlı olarak, sekme 1'de kalmak veya sekme 2'ye gitmek ve sekmelerin içeriğini yenilemek istiyorum.

Benim TabView: Ben yönteminde aktif sekme dizini değiştirmeden bunun gibi, yeterli olacağını düşündük

public void doStuff() { 
    s1 = String.valueOf(Math.random()); 
    s2 = String.valueOf(Math.random()); 
} 

: simly değerlerini değiştirir

<h:form id="form"> 
    <p:tabView id="tabview" activeIndex="#{ctrl.idx}" dynamic="true" cache="false"> 
     <p:ajax event="tabChange" listener="#{ctrl.doStuff}" update=":form:tabview"/> 
     <p:tab title="Tab 1" id="t1"> 
      <h:panelGrid columns="1" cellpadding="10"> 
       <h:outputText value="#{ctrl.s1}"/> 
      </h:panelGrid> 
     </p:tab> 
     <p:tab title="Tab 2" id="t2"> 
      <h:panelGrid columns="1" cellpadding="10"> 
       <h:outputText value="#{ctrl.s2}"/> 
      </h:panelGrid> 
     </p:tab> 
    </p:tabView> 
</h:form> 

Testim kodu

public void doStuff() { 
    // ... 
    idx = 0; 
} 

tabChange olayında, yöntem çağrılır, ancak tabview bileşenleri tıklanan ta gider. b, idx yeni değerini göz ardı ederek.

p:ajax'a bir güncelleştirme özniteliği ekleyerek tüm sekme görünümünü oluşturmayı düşündüm, ancak yalnızca sekmeler ve/veya sekmelerin içeriği yeniden oluşturuluyor. > Bileşen sayfasından kaybolur -

Ve update=":form:tabview"update=":form" veya update="@form", ben sadece ajax yanıtta sekmenin içeriği almak değiştirirseniz tüm en garip,

!

Benim fasulye viewscoped edilir, ben Primefaces 3.5, JSF 2.1 ve Tomcat 7.

herhangi bir fikir kullanıyorum? Teşekkürler.

cevap

0

deneyin sizin yedekleme fasulye sunucu tarafı bileşen örneğine sizin TabView bağlamak için bu h:panelgrid

h:panelGrid id="mainPanel"> 

<p:tabView id="tabview" activeIndex="#{ctrl.idx}" dynamic="true" cache="false"> 
     <p:ajax event="tabChange" listener="#{ctrl.doStuff}" update=":form:mainPanel"/> 
     <p:tab title="Tab 1" id="t1"> 
      <h:panelGrid columns="1" cellpadding="10"> 
       <h:outputText value="#{ctrl.s1}"/> 
      </h:panelGrid> 
     </p:tab> 
     <p:tab title="Tab 2" id="t2"> 
      <h:panelGrid columns="1" cellpadding="10"> 
       <h:outputText value="#{ctrl.s2}"/> 
      </h:panelGrid> 
     </p:tab> 
    </p:tabView> 


</h:panelGrid> 
+0

Ben zaten denemiştim ama bir şey değişmez. Sadece sekmelerin içeriği yanıttadır, bu nedenle tabview konteyneri "kaybolur". – Virginie

9

deneyin bu yolu gibi panelgrid daki TabView tutmak ve güncellemek için. daki TabView için yedekleme fasulye

org.primefaces.component.tabview.TabView tabview=null; 

ve coresponding alıcı ve ayarlayıcı

public TabView getTabview() { 
    return tabview; 
} 

public void setTabview(TabView tabview) { 
    this.tabview = tabview; 
} 

2.Bind sunucu tarafında örneğine

1.Add TabView bileşen örneği

<p:tabView id="tabview" binding=#{yourBean.tabview} dynamic="true" cache="false"> 
... 
</p:tabView> 

3 . DoStuff() yönteminiz

01'i değiştirin.

Ve umarım umarız.

+1

Birçok yükseltmeler, ancak bu yalnızca TAMAMI güncelleştirdiğinizde çalışır. Ve daha sonra kullanmak için bir tabiki kullanmak daha kullanışlıdır 'tabIndex = # {yourbean.idx} '' – Kukeltje

+0

Yukarıdaki yorumu okuyan herkes için not: 'activeIndex =" # {myBean.tabIndex} ", tabIndex değil – Addison

3

i kolay Bunu düzeltmek: currentData içinde

public void onSPTabChange(TabChangeEvent event) 
    { 
    TabView tabView = (TabView) event.getComponent(); 
    currentData.setSP_Index(tabView.getChildren().indexOf(event.getTab())+1); 
    } 

i sekme sayısı ile mülkiyet SP_Index var (birinci, ikinci ....)

<p:tabView id="tabView" styleClass="tabView"> 
<p:ajax event="tabChange" listener="#{dataAccess.onSPTabChange}" /> 
.... 

ve eklemek jquery komut

<script> 
    $("#tabView li:nth-child(#{currentData.SP_Index})").click(); 
</script> 
+0

Bu çözümün activeIndex özniteliğinin kullanımı üzerindeki avantajı, tabView öğesinin tam olarak güncellenmesi gerekmez – Kukeltje

İlgili konular