Активный индекс табуляции не обновляется автоматически - PullRequest
Новая
       28

Активный индекс табуляции не обновляется автоматически

9 голосов
/ 28 марта 2012

Активный индекс не обновляется автоматически.Прочтите в нескольких постах, что, поместив tabView в форму, он работает.Или включив <p:ajax event="tabChange"/> во вкладку, это работает.Но, похоже, ничего не работает

xhtml

Пример 1: автоматические обновления 

    <p:tabView id="categoryTabView" var="promoArticle" value="#{promotionDetailBean.artDTOs}"  activeIndex="#{promotionDetailBean.activeTabIndex}">
            <p:tab id="categoriesTab" title="#{promoArticle.categoryName}">
                <p:dataTable id="promotionDetail_dataTable" var="articlePromo" value="#{promoArticle.artVO}" selection="#{promotionDetailBean.selectedArt}" rowIndexVar="rowIndex">
                    <p:column id="select" selectionMode="multiple" />

                    <p:column id="barCode">
                        <h:inputText id="barCodeInputTxt" value="#{articlePromo.barCode}"
                        styleClass="inputTextStyle" onchange="onSuggestedValueChange('categoryTabView',#{promotionDetailBean.activeTabIndex}, 'promotionDetail_dataTable',#{rowIndex},'originalCostInputTxt')" />
                    </p:column>
                </p:dataTable>
            </p:tab>
        </p:tabView>

Пример 2: Обновление события tabChange 

  <h:form id="form">
    <p:growl id="growlm" showDetail="true" />  

            <p:tabView id="categoryTabView" var="promoArticle" value="#{promotionDetailBean.artDTOs}"  >
               <p:ajax event="tabChange" listener="#{promotionDetailBean.tabChanged}"  update=":growlm" />
                    <p:tab id="categoriesTab" title="#{promoArticle.categoryName}">
                        <p:dataTable id="promotionDetail_dataTable" var="articlePromo" value="#{promoArticle.artVO}" selection="#{promotionDetailBean.selectedArt}" rowIndexVar="rowIndex">
                            <p:column id="select" selectionMode="multiple" />

                            <p:column id="barCode">
                                <h:inputText id="barCodeInputTxt" value="#{articlePromo.barCode}"
                                styleClass="inputTextStyle" onchange="onSuggestedValueChange('categoryTabView',#{promotionDetailBean.activeTabIndex}, 'promotionDetail_dataTable',#{rowIndex},'originalCostInputTxt')" />
                            </p:column>
                        </p:dataTable>
                    </p:tab>
                </p:tabView>

Мне нужно определить ячейку в событии onChange.Но activeIndex всегда 0, инициализированное значение.Событие не получает вызов.

бин 

private Integer activeTabIndex = 0;
public Integer getActiveTabIndex() {
   return activeTabIndex;
}
public void setActiveTabIndex(Integer activeTabIndex) {
    this.activeTabIndex = activeTabIndex;
}

бин 

public void tabChanged(TabChangeEvent event){
        TabView tv = (TabView) event.getComponent(); 
        this.activeTabIndex = tv.getActiveIndex();
    }

Но событиене сработал.Не обновляется автоматически.

Какие могут быть возможные проблемы?

Спасибо, Шиха

Ответы [ 8 ]

13 голосов
/ 31 мая 2013

Это работает для меня, когда вкладка не содержится внутри формы, но каждая вкладка содержит свою собственную:

  1. Добавление прослушивателя для события изменения вкладки в компонент tabView: 

    <p:ajax event="tabChange" listener="#{userBean.onTabChange}" />

  2. Получение активного индекса из базового компонента TabView, похоже, не работает. Однако в этом случае новая выбранная вкладка обновляется правильно, поэтому мы можем получить индекс, выполнив поиск в дочерних компонентах TabView: 

    public void onTabChange(TabChangeEvent event) 
    {   
        TabView tabView = (TabView) event.getComponent();
        activeTab = tabView.getChildren().indexOf(event.getTab());
    }

Я надеюсь, что это работает и для вас

6 голосов
/ 12 апреля 2012

У меня сработало следующее:

XHTML: 

<p:tabView id="categoryTabView" var="promoArticle"
        value="#{promotionDetailManagedBean.articuloPromocionDTOs}" dynamic="true">
    <p:ajax event="tabChange" listener="#{promotionDetailManagedBean.onTabChange}" />
    <p:tab> ... </p:tab>
</p:tabView>

Боб: 

public final void onTabChange(final TabChangeEvent event) {
    TabView tv = (TabView) event.getComponent();
    this.activeTabIndex = tv.getActiveIndex();
}
4 голосов
/ 13 февраля 2017

Для простых лиц> = 5.0, пожалуйста, используйте следующий код: 

public final void onTabChange(TabChangeEvent event) {
    TabView tv = (TabView) event.getComponent();     
    this.ActiveIndex = tv.getChildren().indexOf(event.getTab());
}
2 голосов
/ 26 февраля 2013

Кажется, что это работает, только если активный индекс не привязан к управляемому компоненту .Но это бесполезно для меня, так как я хочу сохранить синхронизацию с бином-представлением .Я удивлен Primefaces команда еще не разрешила (я работаю с версией 3.5).Однако это работает, если сам p:tabView обернут в h:form вместо того, чтобы иметь один из них для каждой вкладки, но это заставляет вас изменять контекст отправки.

0 голосов
/ 10 июля 2017 
public final void onTabChange(final TabChangeEvent event) {
    TabView tv = (TabView) event.getComponent();
    this.activeTabIndex = tv.getIndex();
}

Это сработало для меня ...

0 голосов
/ 25 февраля 2014

Это легко исправить с помощью: 

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

в currentdata у меня есть свойство SP_Index с номером табуляции (первая, вторая ....) 

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

и добавить скрипт jquery 

<script>
    $("#tabView li:nth-child(#{currentData.SP_Index})").click();
</script>
0 голосов
/ 29 марта 2012

в вашем xhtml вы вызываете listener = "# {promoDetailBean. onTabChange }", но в вашем бине имя метода - public void tabChanged". Так что это не может сработать.

Я попробовал пример с Prime-Showcase по адресу:

в бобе (TabBean): 

private Integer activeTabIndex = 1;

// setter/getter

public void onTabChange(TabChangeEvent event) {
    FacesMessage msg = new FacesMessage("Tab Changed", "Active Tab: " + event.getTab().getTitle());

    TabView tabView = (TabView) event.getComponent(); 
    int activeTabIndex = tabView.getActiveIndex();
    System.out.println("--------" + activeTabIndex);


    FacesContext context = FacesContext.getCurrentInstance();
    Map<String, String> params = context.getExternalContext().getRequestParameterMap();
    String activeIndexValue = params.get(tabView.getClientId(context) + "_activeIndex");
    System.out.println("--------" + activeIndexValue);

    context.addMessage(null, msg);
}

в формате xhtml (tabviewChangeListener.xhtml): 

<p:tabView id="tabView" dynamic="true" activeIndex="#{tabBean.activeTabIndex}">

                <p:ajax event="tabChange" listener="#{tabBean.onTabChange}" update=":form:growl"/>

                <p:tab title="Godfather Part I" id="Godfather1">

Результат, как и ожидалось: В начале отображается вторая вкладка. Я нажимаю первую вкладку, а затем третью. sysout:

-------- 0

-------- 0

-------- 2

-------- 2

0 голосов
/ 29 марта 2012 
<p:column id="barCode">
     <h:inputText id="barCodeInputTxt" value="#{articlePromo.barCode}"
            styleClass="inputTextStyle"   onchange="onSuggestedValueChange('categoryTabView',
   #{promotionDetailBean.activeTabIndex}, 
    'promotionDetail_dataTable',#{rowIndex},
    'originalCostInputTxt')" />    **_____/>_____**
</p:column>
  1. у вас есть дополнительные />

  2. немедленное истина может вызвать проблему с p: ajax, вы должны использовать немедленное истина, если у вас нет проверки или вы пытаетесь отменить операцию. 

    public void tabChange(TabChangeEvent event){
     TabView tabView = (TabView) event.getComponent();
     Tab tab = (Tab) event.getTab();
     String tabChangedMessage = tab.getTitle() + " changed. index=" + tabView.getActiveIndex();
     System.out.println(tabChangedMessage);
     FacesContext fc = FacesContext.getCurrentInstance();
     fc.addMessage(null, new FacesMessage("Tab changed", tabChangedMessage));
}

<p:tabView>
   <p:ajax event="tabChange" listener="#{tabChangeBean.tabChange}" update=":growlId" />
   <p:tab title="tab 1">
   tab1 inside
   </p:tab>
   <p:tab title="tab 2">
   tab1 inside
   </p:tab>
</p:tabView>

Это работает, но активный индекс равен 0.

...