Chart inside accordion tab avoids event tabChange in 5.11

soekris · 06 May 2016, 10:44

Hi

When there is a chart inside a tab on an accordionPanel, tabChange is not fired.

It works in 5.10

Thanks!!

<?xml version='1.0' encoding='ISO-8859-1' ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui"
      xmlns:pm="http://primefaces.org/mobile">

    <f:view  contentType="text/html" renderKitId="PRIMEFACES_MOBILE" />

    <h:head>
        <h:outputStylesheet library="css" name="style.css"/> 
        <h:outputStylesheet library="css" name="jqm-icon-pack-fa.css"/> 
    </h:head>

    <h:body>

        <h:form id="form1">

            <pm:page id="first" swatch="a">

                <p:growl id="msgs" showDetail="true" />

                <pm:content>

                    <p:growl id="growlPlana" autoUpdate="true"/>   
                    
                    <p:accordionPanel  id="accordionGrafics" activeIndex="-1" multiple="false" dynamic="false" cache="true">
                        <p:ajax event="tabChange" listener="#{chartView.onTabChange}"  update=":form1:first:msgs" />
                        <p:tab title="Tab 1">
                             <!-- THIS TAB TRIGGERS LISTENER -->
                            <p:outputLabel value="tab1" />
                        </p:tab>

                        <p:tab title="Tab 2" >
                             <!-- THIS TAB DOES NOT TRIGGERS LISTENER -->
                            <p:chart  id="bar1" type="bar" model="#{chartView.barModel}" style="height:300px" responsive="true"/>
                        </p:tab>                        
                    </p:accordionPanel>
                    
                </pm:content>

            </pm:page>
        </h:form>

    </h:body>

</html>

PS: There is a console error "Uncaught Error: No data specified" but I can't attach here, forum does not allow to do it

10 May 2016, 12:40

Thanks for the sample. I'll review and get back to you. 5.11 -> 5.3.11 right??

soekris · 10 May 2016, 18:13

oops, 5.3.11 exact! sorry

11 May 2016, 12:48

Hi Soekris,

I tested this issue, but I didn't see a bug. I only removed h:outputStylesheet in your sample code. It works fine for me. Please check chartView.barModel values.

My onTabChange method;

Code: Select all

@ManagedBean
public class ChartView implements Serializable {
...
   public void onTabChange(TabChangeEvent e) {
         FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("TabChange", e.getTab().getTitle()));
   }
...
}

Screenshot;

Leah Julius · 03 Jun 2016, 13:39

These links shall be my best friends during this time of mobile web app development!

Chart inside accordion tab avoids event tabChange in 5.11

Who is online