1

Is it possible to re-render the content within a Custom Component from the parent Visualforce Page?

I have a custom component in an apex:outputpanel like so:

<apex:outputPanel id="popup">
    <apex:outputPanel styleClass="customPopup" layout="block" rendered="{!displayPopUp}">
        <c:BuyingJourneyStageRequirements opportunityId="{!chosenOpp}" pageControllerAttribute="{!this}" id="componentToRerender"/>
        <apex:commandButton value="Hide Pop up" action="{!closePopup}" rerender="popup,componentToRerender" oncomplete="componentRerender()"/>
    </apex:outputPanel>
</apex:outputPanel>

The Visualforce page supplies an OpportunityId and a copy of the page controller into the component, so that it can display details from the Opportunity. Clicking the "Hide Pop Up" button clears the Opp and OppId in the custom component controller and rerenders the OutputPanel.

The next time the panel is displayed (with a new OpportunityId supplied), the content of the custom component still shows the details of the previous Opportunity, which is not the desired behaviour. It's not until a link within the content within the Custom Component is clicked that the content refreshes, showing the new Opportunity details.

When I check in the debug logs, I know that the new Opportunity is being queried and returned by the controller, so the data is in place, but the re-render of the custom component content doesn't appear to be happening. Is there a way to force a refresh?

With thanks, Andy

Improve this question

2 Answers 2

Reset to default
2

This can happen when the button that is performing the rerender contains an oncomplete attribute like you have, but does not return false. You either need to make sure that your javascript function always returns false, or simply append "return false();" to the oncomplete attribute... or remove oncomplete all together.

I've been through the same thing. The log shows perfection, screen does not update.

Current:

oncomplete="componentRerender()"

Change to:

oncomplete="componentRerender(); return false;"

You should be able to also remove the rerendering of "componentToRerender" since it's inside the popup... I bet it was just a troubleshooting step you took anyways.

Improve this answer
3
  • Thanks for the response, unfortunately I don't think that's quite it. I've added the "return false;" as suggested (and also tried a few different approaches) and I keep seeing the same issue. The body of the component uses Visualstrap (bootstrap) components and it's these that aren't refreshing until they're interacted with. I've put this to the test by using a mix of visualstrap and non-visualstrap components. The standard VF components are refreshing as expected on cue, it's the Visualstrap components that aren't. Looks like I need to do some more research.... Commented Apr 9, 2015 at 14:46
  • Further update - I've worked out the problem. It's in my code - The update is happening to the logic and components, but not the styling (which made it appear as though nothing was happening). I've still got problems, but at least I know where they are. Thank you for your time. Commented Apr 9, 2015 at 15:33
  • That's great news, I am using "Bootstrap SF1" with the Bootstrap Javascript library (matching versions).... so far it's been working great. Just in case this helps... try not to mix jquery mobile on the same pages as Bootstrap, they can cause uncontrollable behavior since they both manipulate DOM (I took a project over that had both, and I just switched it to bootstrap javascript library instead). You are welcome! Commented Apr 10, 2015 at 3:36
0

In order to close this off:

The issue wasn't with the components, but with the order in which the logic within the apex code for the page and component controller was being instantiated and processed. Some of the styling was based off this logic and so the re-render wasn't behaving as I'd expected. However, it WAS behaving as explicitly coded.

Improve this answer

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.