Datapage Div Auto Refresh Issue With Authorisation

Monoux · December 21, 2015

Hi,

I have an html page with 2 datapages in it. Both are in their own divs. I'm trying to get the second div called 'callback' to refresh every 6 seconds.

I've got this javascript to do it

function autoRefresh_div()
{
$("#callback").load("https://c1eru548.caspio.com/dp.asp?AppKey=f6344000919808bbf8fb4bb59cec&xip_Email=[@authfield:Email]&xip_Current_Password=[@authfield:Current_Password]");
}

setInterval('autoRefresh_div()', 6000)

The URL in the js is the deployment URL from Caspio for the datapage I want refreshing.

Users login into the app and the first page they get is this html page. Both divs load fine at this stage. After 6 seconds the second div refreshes fine, but the system is putting up the User Name and Password fields again so they have to login again. As you can see I've tried to add these parameters to the URL so it autologs in.

However, if I paste the URL it to the same brower window where the two Datapages are it works fine.

So it works if I open it in a full pages after the initial login, but it won't work if it's refreshing a div in the same page.

Any help much appriciate.

Aurora · December 22, 2015

Hello Monoux.

I am afraid you can' refresh you second embedded DataPage and receive cookies of Authenticated fields. This is made due to security in Caspio.

However, you could deploy the second DataPage as Iframe and use the following code:

!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta charset="utf-8" />
 <title></title>
 <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
</head>
<body>
<table style="border: 3px solid red;">
 <tr>
  <td>
   <a href="YOUR LOGOUT LINK">Logout</a>
  </td>
 </tr>
 <tr>
  <td>
   <div id="parent">
    EMBEDDED CODE OF 1 DATAPAGE
   </div>
  </td>
 </tr>
 <tr>
  <td>
   <div id="callback">
    IFRAME CODE OF 2 DATAPAGE
   </div>
  </td>
 </tr>
</table>

<script type="text/javascript">
 function autoRefresh_div() {
  $("#callback").empty().html('<iframe name="NAME OF SECOND DATAPAGE" title="NAME OF SECOND DATAPAGE" ' 
   + 'style="width: 500px; height: 500px" '
   + 'src="URL OF SECOND DATAPGE">Sorry, but your browser does not support frames.</iframe>'); 
  // a function which will load data from other file after x seconds
 }

 setInterval(function() {
  autoRefresh_div();
 }, 6000);

</script>

</body>
</html>

Please insert correct URLs and names of your DataPages.

Aurora

Monoux · December 22, 2015

Hi Aurora,

Many thanks for your response.

I'll give it a try now and post back.

Kind regards

Monoux

Monoux · December 22, 2015

Hi Aurora,

That's worked perfectly, thanks so much.

Kind regads

Monoux

bahar_vm · December 22, 2015

Maybe instead of the long code above, you can try putting the following line of code in the header of your second DataPage which refreshes the DataPage every X seconds (5 in this case). If this works for you, it's a much easier solution.

Best,

Emma

Monoux · December 23, 2015

Hi Emma,

Thanks for the idea.

I added a Header and Footer to the Datapage and added the code you provided in the Header. Unfortunately it is refreshing both Datapages that live in the HTML page, which I don't want to happen. I need only the second Datapage to refresh leaving the first one unchanged. Users are clicking in the first Datapage record and they will loose their location if the Datepage refreshes.

Kind regards

Monoux

Monoux · December 23, 2015

Hi Aurora,

I've run into a bit of a problem with the deployment.

The Datapage refreshes perfectly, but now I can't access the DOM in the iFrame. I'm trying to capture some updated text that's in the iFrame and I can't get access to it. I thought it was because my domain wasn't https, but it still doesn't work even though I've changed this.

I've read on the web that accessing the content in iFrames desn't work when the iFrame isn't server from the same domain, which is the case we have here.

Have you come across a work around for this, by any chance?

Kind regards

Monoux

Monoux · December 23, 2015

Hi Aurora,

I thought it mightbe useful if I posted the exact error message I'm getting back from Caspio.

Blocked a frame with origin "https://192.168.0.50" from accessing a frame with origin "https://c1eru548.caspio.com". Protocols, domains, and ports must match.

I guess the protocols and ports match, but I was wondering if there was a work around for the domain issue withut compromising on security.

Kind regards

Monoux

JEllington · December 28, 2015

I am faced with the same situation of updating one data page while leaving the other form on the same page in the same state.

I am hoping the solution would be through AJAX "XMLHttpRequest" to refresh just the 2nd datapage element.

I know there is datapage support for AJAX as you can disable it with in the form. I realize this is internal to bridge, but should be available to us aswell.

FinTheHuman · January 19

Hey there! Caspio released a new feature that allows you to customize your domain for your Caspio-powered applications.

Source:
https://howto.caspio.com/release-notes/caspio-44-0/#:~:text=Release Notes-,Custom Domains,-We are excited
https://howto.caspio.com/managing-your-account/account-settings/custom-domain/

Login

Datapage Div Auto Refresh Issue With Authorisation

Recommended Posts

Monoux

Link to comment

Share on other sites

Aurora

Link to comment

Share on other sites

Monoux

Link to comment

Share on other sites

Monoux

Link to comment

Share on other sites

bahar_vm

Link to comment

Share on other sites

Monoux

Link to comment

Share on other sites

Monoux

Link to comment

Share on other sites

Monoux

Link to comment

Share on other sites

JEllington

Link to comment

Share on other sites

FinTheHuman

Link to comment

Share on other sites

Join the conversation

Browse