Can not generate p:datatable in h:panelgrid values on ajax p:commandbutton update

StackOverflow https://stackoverflow.com/questions/18320733

Question

I am developing a project in JSF2.1 ,prettyfaces, hibernate 4 , primefaces I am getting a problem here… I ve one p:commandbutton which calls ajax request where condition checks that, financial year is opened or not

<p:commandButton id="isFinancialYearSubmitId" value="submit"  update="isFinancialYearBooleanPanelGridId scenarioTabViewId:budgetAnalysisDataTableId" action="#{budgetAnalysisAction.isFinancialYearOpened}"  oncomplete="isFinancialYearOpenedOnComplete();"/>

There are 3 value… if financial year is opened then ‘1’ if financial year is closed then ‘0’ if invalid then ‘ -1’ If financial year is closed or invalid then an image is loaded with some text ,but problem is here If financial year is opened then I want to generate a p:dataTable 

<h:panelGrid columns="2" id="isFinancialYearBooleanPanelGridId" styleClass="panelGridCenter" >
<h:column>
<ui:fragment rendered="#{budgetAnalysisAction.budgetFinancialYearBean.financialYearForProposalsBean == '-1'}">
<ui:fragment rendered="#{budgetAnalysisAction.util.errorCode == '-1'}" >
<h:outputText  value="&lt;div class='n_error'>&lt;p>Error . #{budgetAnalysisAction.util.errorMessage}&lt;/p>&lt;/div>" escape="false"/> 
</ui:fragment>
</ui:fragment>
<ui:fragment rendered="#{budgetAnalysisAction.budgetFinancialYearBean.financialYearForProposalsBean == '0'}">
<ui:fragment rendered="#{budgetAnalysisAction.util.errorCode == '-1'}" >
<h:outputText  value="&lt;div class='n_error'>&lt;p>Error . #{budgetAnalysisAction.util.errorMessage}&lt;/p>&lt;/div>" escape="false"/> 
</ui:fragment>
</ui:fragment>
</h:column>
<h:column>
<ui:fragment rendered="#{budgetAnalysisAction.budgetFinancialYearBean.financialYearForProposalsBean == '1'}">
<p:tabView id="scenarioTabViewId" style="width:850px" >
<p:tab title="Scenario One" id="scen"> 
<p:dataTable id="budgetAnalysisDataTableId" editable="true" scrollable="true" scrollWidth="800" resizableColumns="true" value="#{budgetAnalysisAction.budgetScenarioHescoProposalBean.budgetScenarioHescoProposalListBean}" var="budgetScenarioHescoProposalList">
… HERE ARE SOME COLUMNS
</p:dataTable>  
</p:tab>
</p:tabView>
</ui:fragment>
</h:column>     
</h:panelGrid>

When I submit the command button update=” isFinancialYearBooleanPanelGridId scenarioTabViewId:budgetAnalysisDataTableId” It will process successfully when financial year is closed or invalid But it will not generate p:dataTable id="budgetAnalysisDataTableId values when financial year is opened

but when i put

<p:tabView id="scenarioTabViewId" style="width:850px" >
<p:tab title="Scenario One" id="scen"> 
<p:dataTable id="budgetAnalysisDataTableId" editable="true" scrollable="true" scrollWidth="800" resizableColumns="true" value="#{budgetAnalysisAction.budgetScenarioHescoProposalBean.budgetScenarioHescoProposalListBean}" var="budgetScenarioHescoProposalList">
… HERE ARE SOME COLUMNS
</p:dataTable>  
</p:tab>
</p:tabView>

outside the

<h:panelGrid columns="2" id="isFinancialYearBooleanPanelGridId" styleClass="panelGridCenter" >

p:dataTable works fine for me

Any idea thanks (Y)

Here is my full xhtml file

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<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">

<!-- <link rel="stylesheet" type="text/css" href="/css/style.css"></link>  --> 
<h:head> 
    <h:outputStylesheet name="style.css" library="css" target="head"/>
    <h:outputScript name="validate.js" library="js" target="head"/> <!--    no need here because this file called by mastertemplate due to insert and define tag of jsf  --> 
    <h:outputScript name="jsf.js" library="javax.faces" target="head" />
    <h:outputStylesheet name="login.css" library="css" target="head"/>




</h:head>
<!--  <body class="main_background"> -->
<h:body >
<p>hello </p>
<ui:composition template="/template/mastertemplate.xhtml">  

    <ui:define name="content">
<f:view>


<div id="main">
            <div class="full_w" style="height: auto; max-width: 1045px; overflow: hidden;">
                <div class="h_title">Formation's Proposal</div>
                    <h:form styleClass="form" prependId="false" id="anaForm">
                        <p:panel id="formationsproposalPenel" header="Analysis The Budget">
                                <div class="divPanel">
                                        <div align="right" class="divContent">
                                                <div align="left" style="margin-top: 10px;">
                                                            <h:panelGrid columns="4" id="isFinancialYearPanelGridId">
                                                                        <h:column>
                                                                                <h:outputLabel value="Enter financial year " />
                                                                        </h:column>
                                                                        <h:column>
                                                                                <p:inputMask id="isFinancialYearFromId" style="width:50px" mask="9999" value="#{budgetAnalysisAction.budgetFinancialYearBean.isFinancialYearFromBean}" /> -
                                                                        </h:column>
                                                                        <h:column>
                                                                                <p:inputMask id="isFinancialYearToId" style="width:50px" mask="9999" value="#{budgetAnalysisAction.budgetFinancialYearBean.isFinancialYearToBean}" />
                                                                        </h:column>
                                                                        <h:column>
                                                                                <p:commandButton id="isFinancialYearSubmitId" value="submit"  update="isFinancialYearBooleanPanelGridId scenarioTabViewId:budgetAnalysisDataTableId" action="#{budgetAnalysisAction.isFinancialYearOpened}"  oncomplete="isFinancialYearOpenedOnComplete();"/>
                                                                        </h:column>
                                                            </h:panelGrid>
                                                <p:separator id="separatorId" style="border:1px solid #b8b8b8;margin-top:5px; width:80%;"/> 

                                                </div>

                                                <h:panelGrid columns="2" id="isFinancialYearBooleanPanelGridId" styleClass="panelGridCenter" >
                                                        <h:column>
                                                                <ui:fragment rendered="#{budgetAnalysisAction.budgetFinancialYearBean.financialYearForProposalsBean == '-1'}">
                                                            <ui:fragment rendered="#{budgetAnalysisAction.util.errorCode == '-1'}" >
                                                                    <h:outputText  value="&lt;div class='n_error'>&lt;p>Error . #{budgetAnalysisAction.util.errorMessage}&lt;/p>&lt;/div>" escape="false"/> 
                                                            </ui:fragment>
                                                        </ui:fragment>
                                                        <ui:fragment rendered="#{budgetAnalysisAction.budgetFinancialYearBean.financialYearForProposalsBean == '0'}">
                                                            <ui:fragment rendered="#{budgetAnalysisAction.util.errorCode == '-1'}" >
                                                                    <h:outputText  value="&lt;div class='n_error'>&lt;p>Error . #{budgetAnalysisAction.util.errorMessage}&lt;/p>&lt;/div>" escape="false"/> 
                                                            </ui:fragment>
                                                        </ui:fragment>

                                                        </h:column>
                                                        <h:column>

                                                             <ui:fragment rendered="#{budgetAnalysisAction.budgetFinancialYearBean.financialYearForProposalsBean == '1'}">
                                                             <p:tabView id="scenarioTabViewId" style="width:850px" >
                                                                <p:tab title="Scenario One" id="scen"> 
                                                                <p:dataTable id="budgetAnalysisDataTableId" editable="true" scrollable="true" scrollWidth="800" resizableColumns="true" value="#{budgetAnalysisAction.budgetScenarioHescoProposalBean.budgetScenarioHescoProposalListBean}" var="budgetScenarioHescoProposalList">

                                                                <!--    <p:ajax event="rowEdit" listener="#{}"/>  -->
                                                                        <p:column headerText="Edit" width="30">
                                                                            <p:rowEditor />
                                                                        </p:column>
                                                                        <p:column headerText="Sub Head Of Accounts" width="150" >
                                                                            <h:outputText value="#{budgetScenarioHescoProposalList.budgetSubHeadOfAccountsBean.subHeadOfAccountNameBean}" />
                                                                        </p:column>
                                                                        <p:column width="150" headerText="Average of #{budgetScenarioHescoProposalList.labelLastThreeYearAvgActualExpBean}" styleClass="wwrapTh wrapTd">

                                                                        </p:column>
                                                                        <p:column width="150" headerText="Actual Expenditure Of #{budgetScenarioHescoProposalList.labelLastThreeYearActualExpenditureBean}" styleClass="wwrapTh wrapTd">

                                                                        </p:column>
                                                                        <p:column width="150" headerText="Actual Expenditure Of #{budgetScenarioHescoProposalList.labelLastTwoYearActualExpenditureBean}" styleClass="wwrapTh wrapTd">

                                                                        </p:column>
                                                                        <p:column width="150" headerText="Actual Expenditure Of #{budgetScenarioHescoProposalList.labelLastYearActualExpenditureBean}" styleClass="wwrapTh wrapTd">

                                                                        </p:column>
                                                                        <p:column width="150" headerText="Average Of Allocated Budget #{budgetScenarioHescoProposalList.labelLastThreeYearAvgAllocateBudgetBean}" styleClass="wwrapTh wrapTd">

                                                                        </p:column>
                                                                        <p:column width="150" headerText="Allocated Budget Of #{budgetScenarioHescoProposalList.labelLastThreeYearAllocateBudgetBean}" styleClass="wwrapTh wrapTd">

                                                                        </p:column>
                                                                        <p:column width="150" headerText="Allocated Budget Of #{budgetScenarioHescoProposalList.labelLastTwoYearAllocateBudgetBean}" styleClass="wwrapTh wrapTd">

                                                                        </p:column>
                                                                        <p:column width="150" headerText="Allocated Budget Of #{budgetScenarioHescoProposalList.labelLastYearAllocateBudgetBean}" styleClass="wwrapTh wrapTd">

                                                                        </p:column>
                                                                        <p:column width="150" headerText="Expected Expenditure" styleClass="wwrapTh wrapTd">

                                                                        </p:column>
                                                                        <p:column width="150" headerText="Next Year Budget" styleClass="wwrapTh wrapTd">

                                                                        </p:column>
                                                                        <p:column width="150" headerText="" styleClass="wwrapTh wrapTd">

                                                                        </p:column>

                                                                </p:dataTable>  

                                                            </p:tab>
                                                            <p:tab title="Scenario Two">
                                                            </p:tab>
                                                            <p:tab title="Scenario Three">
                                                            </p:tab>
                                                            <p:tab title="Scenario Four">
                                                            </p:tab>

                                                        </p:tabView>



                                                             </ui:fragment>



                                                        </h:column>     
                                                </h:panelGrid>
                                        </div>  
                                </div>
                        </p:panel>
                    </h:form>
            </div>
        </div>


</f:view>       
    </ui:define>

</ui:composition>
</h:body>

<!-- </body> -->
</html>
Was it helpful?

Solution 2

i ve solved my problem using

.java

RequestContext requestContext = RequestContext.getCurrentInstance();
requestContext.addCallbackParam("budgetFinancialYearBean", this.budgetFinancialYearRefObj);

.xhtml

<p:commandButton id="isFinancialYearSubmitId" value="submit" update="panelGridId scenarioTabViewId:budgetAnalysisDataTableId"  action="#{budgetAnalysisAction.isFinancialYearOpened}"  oncomplete="handleComplete(xhr, status, args); isFinancialYearOpenedOnComplete();"/>

.js

function handleComplete(xhr, status, args) {  

var financialYearForProposalsBeanVar = args.budgetFinancialYearBean.financialYearForProposalsBean;
    if(financialYearForProposalsBeanVar == 1) {
        //rendering data table
    //  alert('value: '+financialYearForProposalsBeanVar);
        document.getElementById("budgetAnalysisDataTableDivId").style.display = "block";    
    }

}

OTHER TIPS

I would like to add this as comment, but maybe I found what is your problem:

In p:commandbutton you have:

update="isFinancialYearBooleanPanelGridId scenarioTabViewId:budgetAnalysisDataTableId"

Shouldn't it be (did you eat colon?)

update="isFinancialYearBooleanPanelGridId:scenarioTabViewId:budgetAnalysisDataTableId"
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top