Auto refresh datapage automatically

[Mikey]

Hello, I am trying to find a way to auto refresh a specific datapage report on a page (has 4 or 5 datapages). I have a  log datapage that I want to refresh as items are added. I want the refresh to happen automatically without refreshing the entire page or other embedded datapages... 

 

Any way to do this?

 

[carlJS]

Hello Mikey,

 

The DataPages deployed on the same pages should automatically be updated with records when an action is done on one of your DataPages. This feature is called AJAX Loading and is enabled by default. You may check on this article for more information: https://howto.caspio.com/datapages/ajax-loading/

 

Let me know if this is not what you're looking for.

 

[src="carl,js"]

[Mikey]

Hello. I should have been more clear... not all of the datapages on the page update the log datapage.. .. I have feeds coming in from other users/datapages that update/insert into a table I am pulling this log from. I see that if they are on the same page it will work.. but what if I have a table that is updated from another person logged into the app .. I want the datapage to refresh every 1 min or automatically when that record is inputted into the table.. hope that makes sense....

[SunakoChan]

Hi @Mikey, If you wanted to automatically refresh/reload your page , this will be needing a JavaScript. You may check this article: https://stackoverflow.com/questions/32913226/auto-refresh-page-every-30-seconds. You might need to adjust it to 60 seconds.

 

[rush360]

Hello... I have a similar question as the OP.  When I use the below JS solution, the entire page reloads.  I have multiple (6) datapages deployed on the same webpage and I only want 3 of them to be autorefreshed.  AJAX loading is enabled so i am aware that when an action is taken in one of the datapages, the results will refresh in the others but I am looking for a solution independent of taking an action in one of the datapages. 

<script language="javascript">
setTimeout(function(){
   window.location.reload(1);
}, 30000);
</script>

 

 

[hussainmirza12345]

Hello. I should have been more clear... not all of the datapages on the page update the log datapage.. .. I have feeds coming in from other users/datapages that update/insert into a table I am pulling this log from. I see that if they are on the same page it will work.. but what if I have a table that is updated from another person logged into the app .. I want the datapage to refresh every 1 min or automatically when that record is inputted into the table.. hope that makes sense...

[hussainmirza12345]

Hello, I am trying to find a way to auto refresh a specific datapage report on a page (has 4 or 5 datapages). I have a  log datapage that I want to refresh as items are added. I want the refresh to happen automatically without refreshing the entire page or other embedded datapages... 

 

Any way to do this?

[IamNatoyThatLovesYou]

Hello everyone, this documentation may be of help regarding automatically refreshing the datapage.  https://howto.caspio.com/faq/reports-datapages/how-to-auto-refresh-a-page/

- Natoy

[Kurumi]

 Hi - Just wanted to share this specific code to refresh/reload the iFrame in your DataPage.

document.getElementById('some_frame_id').contentWindow.location.reload();

Reference: https://stackoverflow.com/questions/86428/what-s-the-best-way-to-reload-refresh-an-iframe

This can be applicable to this article: https://howto.caspio.com/tech-tips-and-articles/create-embeddable-tabbed-interface/

This article provides a script for Tabbed interfaces. As the script is using iFrames, every change of tab - the DataPage will remain as it is. If you are using a Report DataPage, it will not load the new data. As a workaround, you can edit the code that will reload the iFrame with every click of the tab.

Updated script:

<script>
 function getElementByClass(classer) {
 var allHTMLTags=document.getElementsByTagName("*");
 var array = [];
 for (i=0; i<allHTMLTags.length; i++) {
 if (allHTMLTags[i].className==classer) {
 array.push(allHTMLTags[i]);
 }}
 return array;}
 
 function channel(n){
 var frames = getElementByClass("ChannelView");
 var length = frames.length;
 for(var i = 0; i < length; i++)
 { if(frames[i].id == ("viewer"+ n))
 { frames[i].style.display = "inline";
   frames[i].contentWindow.location.reload();

 }else{ frames[i].style.display = "none";}}}
 </script>
 
 <div style="display:block; text-align:left;">
 <div style="display:block;">
 <ul id="menu">
 
 <li><a onclick="channel(0)">Tab 0</a></li>
 <li><a onclick="channel(1)">Tab 1</a></li>
 <li><a onclick="channel(2)">Tab 2</a></li>
 
 </ul>
 </div>
 
 <div class="content">
 
 <iframe frameborder=0 id="viewer0" class="ChannelView" src="URL of Tab 0" style="display:inline"></iframe>
 <iframe frameborder=0 id="viewer1" class="ChannelView" src="URL of Tab 1"></iframe>
 <iframe frameborder=0 id="viewer2" class="ChannelView" src="URL of Tab 2"></iframe>
 
 </div>
 </div>

The change is by adding this code:

frames[i].contentWindow.location.reload();