Joget DX 8 Stable Released
The stable release for Joget DX 8 is now available, with a focus on UX and Governance.
In this article, we will show you how to make a nested datalist to expand in an iframe.
You can use the following script in a custom HTML field in a form and alter the code based on your app.
<iframe name='iframe' id="iframeLoanedItems" src="/jw/web/userview/kb_nestedDatalistIFrame/v/_/basicForm_crud?embed=true" frameborder="0" border="0" cellspacing="0" height="500px" scrolling="yes" style="border-style: none;width: 100%"></iframe> <script> $(document).ready(function(){ $('iframe#iframeLoanedItems').load(function(){ $('.nesteddl_trigger', $('iframe#iframeLoanedItems').contents()).trigger('click'); }) }) </script>
To embed a list inside an iframe you will need to use the <iframe> attribute and target the Menu ID containing the list. In this case "basicForm_crud" is the targeted Menu.
Figure 1: Targeted Menu ID
embed=true
Do take note "embed=true" is important. If not inserted in src, the whole targeted page will be displayed in the iframe instead of the List only.