Reload or refresh page include?

  • 4
  • Question
  • Updated 2 months ago
  • Answered
Simple one for you all:
How can I force a page include to reload?

Thanks!
Photo of Matt Sones

Matt Sones, Champion

  • 32,156 Points 20k badge 2x thumb

Posted 4 years ago

  • 4
Photo of Matt Sones

Matt Sones, Champion

  • 32,156 Points 20k badge 2x thumb
Got it! (at least one way)
skuid.$('#MyPageInclude').data('object').load();
Photo of Christopher Johnson

Christopher Johnson

  • 694 Points 500 badge 2x thumb
Hi Matt, I'm curious how you got this working. I've tried replacing the #MyPageInclude with both the name of the page that is included and the unique ID of the page include component in the JS snippet. I'm trying to run the snippet as an action from a button in a wizard. I'm getting the error:
TypeError: skuid.$(...).data(...) is undefined

Any pointers?

Also for context, I'm working on resolving an issue of a page include at the end of a wizard (which should present all the data entered in the wizard) is not refreshing after data is changed in the wizard (despite it being saved to the models successfully). I figure I have to force a refresh of the page include.
Photo of Matt Sones

Matt Sones, Champion

  • 32,156 Points 20k badge 2x thumb
Christopher,

How about setting your wizard to not load all the pages initially... you can just have them load as you get to the page. In which case, your page include at the end will only render after eveything else, and should have your data.

The script above should still work. You have to replace "MyPageInclude" with the unique id of your page include component... you need to keep the #.

Does that help?
Photo of Christopher Johnson

Christopher Johnson

  • 694 Points 500 badge 2x thumb
Thanks for getting back on this thread. I verified I have the component ID in there (thanks for the note about the "#"...I had dropped that).

I'm also trying what skuid lists in the pop up help on the lazy load option for a page - skuid.component.getById('MyPageIncludeComponent').refresh()
(Note: In case the skuid guys are follwing, theinline documentation for page include lazy load seems to reference "load" which is not documented on skuid.component, so I assume it should be "refresh" instead)

One of the issues I'm having is that it isn't just the initial load of the page include component, but subsequent loads that need to refresh during the same session for the user. The use case is the final page of anapplication (wizard) where the final page is a page include of the full application print out (eg a review step for user before submitting). So they see the review and then go back and edit data in the models (which are saved by the wizard) but when they get back to the review page, it is not reflecting the updates made and already saved.

I noticed that the "Include" visualforce page has changed over the course of some Skuid upgrades so I'm going to try updating the local version.I'll also experiment with adding in cache="false" to that local copy.
Photo of Dan Arnison

Dan Arnison

  • 320 Points 250 badge 2x thumb
We are using Page Includes to compose complex pages and performance is proving to be an issue... included sections often need around five seconds to render.

To work around this we attempted to preemptively load a number of Includes using Matt's snippet above. This causes the browser become unresponsive while the page includes are processing (again, for around five seconds).

Is there a way to cause the page include component to process without blocking the main page... i.e. so that while the page include is displaying the "Loading..." message the remainder of the page that isn't affected by the page include remains responsive?
Photo of Kathryn Castle

Kathryn Castle

  • 814 Points 500 badge 2x thumb
Did Dan's point above get a response at any point? I'm having the same issue and would love a way to force certain page includes to load whilst allowing the remainder of the page to stay responsible. 
Photo of Jack Sanford

Jack Sanford, Champion

  • 10,090 Points 10k badge 2x thumb
+ 1 for Dan's and Kathryn's idea. Would love for page includes to load in the background without freezing the screen
Photo of Gyan

Gyan

  • 1,422 Points 1k badge 2x thumb
Hi team,

We are getting page include object, changing pagename and querystring properties the include object and loading the page include after changing page for the page include.

var $ = skuid.$;
 // original page of the include
var include = $('#main-include');
var includeObj = include.data('object'); //includeObj.pagename is originally 'shared_task_list';
// changing the page include page with task_basics_view;
includeObj.pagename = 'task_basics_view'; 
includeObj.objecttype = '';
includeObj.querystring = '';
includeObj.load();

This is all working fine. However, with recent skuid version (11.2.8) model are not being cleared from previous page; i.e. even after switching page from shared_task_list to task_basics_view and loading the include, we can access model of shared_task_list from the console. Any clue?


Thank you.
Gyan


Photo of Johnny Sey

Johnny Sey

  • 584 Points 500 badge 2x thumb
Tried using this:

skuid.$('#sk-3Uw5-2712').data('object').load();

It works in preview, but on the skuid component on lightning page, it doesn't reload the data.  I am guessing it's because I didn't pass a value for 'object'?  What is the object suppose to be?
(Edited)
Photo of Johnny Sey

Johnny Sey

  • 584 Points 500 badge 2x thumb
Any help?
Photo of Jack Sanford

Jack Sanford, Champion

  • 10,090 Points 10k badge 2x thumb
I've had issues with this as well. If it's already loaded it won't re-load by using .load();

One way I've gotten around it is to use .unrender() or even .unregister() prior to the load, might be something to try. 

You can also do shorthand for getting your page include like this: skuid.$C('#sk-3Uw5-2712')

Finally just make sure you've got the right component id, you might give it a unique name instead of using the skuid-assigned name. 
var params = arguments[0],
$ = skuid.$;
var pageInclude = skuid.$C('#sk-3Uw5-2712');
pageinclude.unrender();
// OR pageinclude.unregister();
pageInclude.load();


A completely other track you might consider, if you just need to refresh certain data within the page include, you can publish an event on your outer page, and create an action sequence that listens for the event within the page include to run your re-queries or whatever actions. 

Photo of Johnny Sey

Johnny Sey

  • 584 Points 500 badge 2x thumb
Hi Jack

Thank you for your help.  I got it to work with your codes with a couple of fixes:

var params = arguments[0],
$ = skuid.$;
var pageInclude = skuid.$('#sk-3Uw5-2712').data('object');
pageInclude.unrender(); pageInclude.load(); Thanks for your help again, it was appreciated.
(Edited)
Photo of Zach McElrath

Zach McElrath, Employee

  • 54,004 Points 50k badge 2x thumb
In V2 pages, you can declaratively reload a page include, load a different page, or unload the page that's there. This is done via the "Run Component Action" action in the Action Framework. You select the Page Include component that you want to interact with, and then you have the choice of the above three options.
Photo of Jack Sanford

Jack Sanford, Champion

  • 10,090 Points 10k badge 2x thumb
*sigh* you're really going to make us upgrade aren't you? :)
Photo of Zach McElrath

Zach McElrath, Employee

  • 54,004 Points 50k badge 2x thumb
Just gonna keep dangling more of these carrots out there until it happens :)
Photo of Arne-Per Heurberg

Arne-Per Heurberg

  • 3,036 Points 3k badge 2x thumb
What about for the carnivores?