How to make a iframe dynamic height in skuid

If you can see the image the red highlighted area is nothing but an iframe.

I have a table which has drawer and each drawer is having an iframe which loads another skuid page.
Every row of main table has drawer and every drawer has same iframe with same skuid page.

How to make the height dynamic. tried some code but its not working for all the rows. It’s like once the height we got that is what the height it’s displaying for all other rows.

So onload of iframe i am calling below function to make dynamic height

function onLoadOfIFrame(obj) { //obj is the id of the iframe which i am trying to pass. As every row have diff ids.
obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + ‘px’;
//var height = $(‘#’ + nid).height();
//$(‘#’ + nid).height(height);
}

But’s not working for all the rows. Anybody have any idea do share how to make it dynamic which works just like the (place a skuid page in drawer as page include).

  • Hey Dsahoo, thanks for bringing this issue to our attention.

    Can I ask why you’re using an iframe in the drawers rather than the page include component?

  • What's the desired behavior? It sounds like you want the drawer content to be a set height with scroll-bars, is that correct?
  • We are using a table where each row have drawer and each drawer using same page (if we use page include). Now while doing any operation inside that common page for e.g. add a row it’s not adding in the right table. Even we can’t use context of skuid. So as models are also same we have no other option to go for iframe.

    This doesn’t answer your question either. But an improvement we made in the V2 page API was that Page Includes are sandboxed, and so it is totally acceptable to have multiple instances of the same page include showing. The models will stay separate, the data will stay connected to the context that was passed to it etc. Operations are independent. All those problems are solved…

    But you are on the V1 page API - and it doesn’t work that way there. So iframe.

    The internet suggests that the only way to make iframe height dynamic is with some extra Javascript. I think you can find that on Stack Overflow.