Primefaces Calendar not working in different Tabs when dynamic is set true

Question

I am trying to design calendar in two separate tabs.I am unable to open calendar popup after navigating to different tab Main.xhtml(Where Tabs are designed)

    <p:tabView id="CRE_CI" widgetVar="TabV" prependId="false" cache="false" dynamic="true">
    <p:tab title="CRE Residential Input" style="outline: 0;">
    <ui:include src="CRE//abc.xhtml" />
    </p:tab>
    <p:tab title="CRE Commercial Analysis" style="outline: 0;">
    <ui:include src="CRE//xyz.xhtml" />
    </p:tab>
    </p:tabView>

abc.xhtml

   <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:ui="http://java.sun.com/jsf/facelets"
   xmlns:p="http://primefaces.org/ui">
   <h:head>
   <title>Commercial Analysis</title>
    </h:head>
    <div id="CRECommAnalysis">
    <h:body>
    <h:form id="crecommform">
    <p:calendar id="commcal1" navigator="true" pattern="MM/dd/yy"style="width:100%" >
                    </p:calendar>
            </h:form>
        </h:body>
    </div>
    </html>

xyz.xhtml

    <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:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">
    <h:head>
    <title>Commercial Analysis</title>
    </h:head>
    <div id="CRECommA">
    <h:body>
    <h:form id="crecomm">
    <p:calendar id="commcal2"/>
    </h:form>
    </h:body>
    </div>
    </html>

Please note that it's working fine when dynamic="true" from Main.xhtml is removed

score 0 · Accepted Answer · edited Sep 17 '17 at 03:12

You build your pages for include wrong. This works for me.

index.xhtml

<!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:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">
<h:head>
    <title>Commercial Analysis</title>
</h:head>
<h:body>
        <p:tabView id="CRE_CI" widgetVar="TabV" prependId="false"
            cache="false" dynamic="true">
            <p:tab title="CRE Residential Input" style="outline: 0;">
                <ui:include src="abc.xhtml" />
            </p:tab>
            <p:tab title="CRE Commercial Analysis" style="outline: 0;">
                <ui:include src="xyz.xhtml" />
            </p:tab>
        </p:tabView>
</h:body>
</html>

abc.xhtml

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">
    <div id="CRECommAnalysis">
        <h:form id="crecommform">
            <p:calendar id="commcal1" navigator="true" pattern="MM/dd/yy"
                style="width:100%">
            </p:calendar>
        </h:form>
    </div>
</ui:composition>

xyz.xhtml

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">
    <div id="CRECommA">
        <h:form id="crecomm">
            <p:calendar id="commcal2" />
        </h:form>
    </div>
</ui:composition>

Thanks it worked,but now my concern is when I was using html tag instead of why everything was working perfect but calendar. — Akash D, Dec 08 '16 at 09:31

Primefaces Calendar not working in different Tabs when dynamic is set true

1 Answers1