Jump to content

Adjust the size of a frame based on content

Recommended Posts

Modify the frame code you have in your parent report to pass the unique identifier of the parent report through the link, so you need to select "[@field:Parent_ID]" from picker in the code below and also replace "https://xx.caspio.com/dp.asp?AppKey=APPKEY" with the actual URL of the child report:

<iframe id='cbframe[@field:Parent_ID]' src="https://xx.caspio.com/dp.asp?AppKey=APPKEY&Parent_ID=[@field:Parent_ID]" style='width:200px;'></iframe>

On the same page, parent report add the following code to the header:

<script type='text/javascript'>
function iframeLoaded(element_id){
var iframe = document.getElementById(element_id);
var padding = 16;
var height = iframe.contentWindow.document.body.scrollHeight + padding;
iframe.style.height = height + "px";


In the child report add the following code to the footer, this is the page that show as iframe.

<script type='text/javascript'>
var cb_parent_id = "[@Parent_ID]";
window.onload = function(){



The only code that needs to be modified is the very first one in iframe code, you do not need to change anything in JS codes.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...