+ Start a Discussion
Karthik TathiReddyKarthik TathiReddy 

Outputpanel rendering not working on given conditions untill the page refreshes

<apex:outputPanel id="repeatList">
           <apex:repeat var="vw" value="{!VenuesWrapper}">
	<!-- Accordion Start -->			
	 <div class="accorden_bdr">
                    <h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all ui-accordion-icons" role="tab" id="ui-accordion-2-header-3" aria-controls="ui-accordion-2-panel-3" aria-selected="false" tabindex="-1">{!vw.venue.MD_Locations_Serviced__r.name}<apex:outputPanel id="recomendationcreatedStatus" rendered="{!IF(vw.isRequestSent,'true','false')}">
                            <div class="refferal_color bold tab_pad">Referral Sent</div></apex:outputPanel> </h3>
                    <div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" id="ui-accordion-2-panel-3" aria-labelledby="ui-accordion-2-header-3" role="tabpanel" aria-expanded="false" aria-hidden="true" style="display: none;">
                        <div class="refer_divm">
                            <div class="refer_couple" style="color: #d7666a;">Check "Refer to Couple" to send this pricing information with this Venue.>></div>

			 <div class="refer_chkbox">

			<!-- Outputpanel start for checkbox region -->                           
                                 <apex:outputPanel id="recomendationNotcreated" rendered="{!IF(AND(vw.venue.Recommendations__r !=null && vw.venue.Recommendations__r.size==0), 'true', 'false')}">
            					   <apex:form id="ReferToCouple">   
                                    <apex:outputLabel value="REFER TO COUPLE" for="referLabel"/>
                                     <apex:inputCheckbox value="{!vw.isReferCoupleRefered}" id="referLabel" styleClass="referLabel">
                                        <apex:actionSupport event="onclick" action="{!createRecomendation}" rerender="headerComponent,repeatList,recomendationcreated" status="loading">
                                          <apex:param name="vid" value="{!Venue_DB__c.id}" assignTo="{!venueRefId}"/>
                                          <apex:param name="venueRefd" value="{!vw.venue.id}" assignTo="{!venuePricingInfoRefId}"/>
                                          <apex:param name="locservice" id="locservice" value="{!vw.venue.MD_Locations_Serviced__c}" assignTo="{!locationServicedRefId}"/>
                                        </apex:actionSupport>
                                        <apex:actionStatus id="loading">
                                          <apex:facet name="start">
                                            <div class="loading lext"></div>
                                              <div class="innerBlock">
                                                <img class="waitingImage" src="/img/loading.gif" title="Please Wait..." />
                                              </div>
                                          </apex:facet>
                                        </apex:actionStatus>
                                     </apex:inputCheckbox>
                                  </apex:form>
                                </apex:outputPanel>
			<!-- Outputpanel end for checkbox region -->                           

                        <!-- Outputpanel start for Remove link region -->
                                 <apex:outputPanel id="recomendationcreated" rendered="{!IF(AND(vw.venue.Recommendations__r !=null && vw.venue.Recommendations__r.size!=0), 'true', 'false')}">
                                  <apex:form id="RemoveToCouple"> 
                                    <!--  Testing -->
                                    <!-- {!vw.venue.id} -->
                                    <!--  Testing -->
                                        <apex:commandLink styleClass="clearRefer Remove" value="Remove" action="{!deleteRecomendation}" rerender="headerComponent,repeatList" status="loadingStatus">
                                         <apex:param name="dvid" value="{!vw.venue.id}" assignTo="{!venueRefId}"/>
                                        </apex:commandLink>
                                        <apex:actionStatus id="loadingStatus" startText=" (loading...)" stopText="">
                                          <apex:facet name="start">
                                            <div class="loading lext"></div>
                                            <div class="innerBlock">
                                              <img class="waitingImage" src="/img/loading.gif" title="Please Wait..." />
                                            </div>
                                          </apex:facet>
                                        </apex:actionStatus>
                                  </apex:form>
                                </apex:outputPanel>
                        <!-- Outputpanel end for Remove link region -->

                            </div>
                          </div>
                        <div style="width:100%; float:left;">
         
                                  <div class="bold ceremony_start" style="margin-top: 13px;">Ceremony Starting Price Includes</div>
                                    <div class="number_div"><apex:outputPanel id="cerPriceIncludes" rendered="{!IF(vw.venue.Ceremony_Starting_Price_Includes__c==null || vw.venue.Ceremony_Starting_Price_Includes__c=='', true,false)}">n/a</apex:outputPanel><apex:outputField value="{!vw.venue.Ceremony_Starting_Price_Includes__c}"/></div>

                               <div class="bold" style="color:#50332A; width: 47%; float: left !important;">Price Description</div><br/>
                                <apex:outputPanel id="priceDescp" rendered="{!IF(vw.venue.Price_Description__c==null || vw.venue.Price_Description__c=='', true,false)}">n/a</apex:outputPanel><apex:outputField value="{!vw.venue.Price_Description__c}" />
                                 
                        </div>

                                <div class="padtop_mini bold" style="color:#50332A; padding-top: 10px;width: 100%;float: left;">Packages</div>
                  <table>
                  <tr>
                  <td><b><apex:outputPanel id="packOffered" rendered="{!IF(vw.venue.Packages_Offered__c==null || vw.venue.Packages_Offered__c=='', true,false)}">n/a</apex:outputPanel><apex:outputField value="{!vw.venue.Packages_Offered__c}" /></b></td>
                  <td>Packages Offered?</td>
                  </tr>
                  </table>
                    </div>
                   </div>

		<!-- Accordion End -->
           </apex:repeat>          </apex:outputPanel>

 

I have a check box written using stylesheets for displaying as accordions in a apex:repeat method. This would generate multiple accordions and the same checkbox for every accordion. The VF code is shown above...

 

I need to render the remove link section when I click on checkbox and need to render the checkbox region when clicked on remove link. The functionlity is working if I refresh the page when I Perform actions on the two regions.

I need to work the functionality when i click on the checkbox and remove link without manually refreshing the page.

Any ideas please post your comments....

 

Best Answer chosen by Admin (Salesforce Developers) 
bob_buzzardbob_buzzard

Yes, that will be working fine in the database.  However, your page relies on the records cached in your controller, and these won't be updated unless you query them again from the database.

All Answers

bob_buzzardbob_buzzard

It looks like your conditional rendering is based on the number of related objects - how are you updating that number?  I.e. do you save everything and requery, or are you expecting it to update based on some other action you are taking?

Karthik TathiReddyKarthik TathiReddy

Oncheck am inserting a record under the related list(Recommendation object). In the same, the output panel renders only if there is no related record for the parent object. If I click on remove link the created Recommendation record is deleted under the parent object. Here also am checking the condition for rendering the checkbox region when clicked on remove link.

The functionality is working fine but rendering is happening only if I reloads the page.

bob_buzzardbob_buzzard

Does reloading the page query the information back from the database again? 

Karthik TathiReddyKarthik TathiReddy

Yes, the page information comes from the database again when i reloads the page. It is working but I am unable to view the data inside the accordions when I using checkbox and remove link

bob_buzzardbob_buzzard

That sounds like you are expecting your version of the records to update in memory when you add/remove related records - is that the case?

Karthik TathiReddyKarthik TathiReddy

Yes bob_buzzard.

bob_buzzardbob_buzzard

When you add/remove records from the database, that has no effect on the record that you have in memory.  

 

I suspect you'll need to query the parent and its related records to get the up to date view of the relationship.  You could try writing directly to the related objects list, but the last time I tried that the platform wouldn't allow it. 

Karthik TathiReddyKarthik TathiReddy

Thanks for the suggestion, Even I checked my database whether the functionality of creating and deleting records from the VF page is working or not. But everything is fine according to functionality. The accordions are just hiding the data inside them and cannot view untill I manually reloads the page.

bob_buzzardbob_buzzard

Yes, that will be working fine in the database.  However, your page relies on the records cached in your controller, and these won't be updated unless you query them again from the database.

This was selected as the best answer
Karthik TathiReddyKarthik TathiReddy

Thanks Bob, your idea is working. Thanks a lot.