function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Ravindar AdminRavindar Admin 

Problem with Iframe "Rectangle line"

When we use Iframe for opening a report in Visualforce page, It is appearing with the "Rectangle line" as below. If we scroll down to bottom, the top data is disappearing. Can we remove the "Rectangle line" to make the data appear? or is there any tag to open the report(URL) through the getter methods in Visualforce page Itself. 

User-added image

Visualforce Code:

<div class="container">
                    <apex:iframe src="{!ReportsTabularUrl}" scrolling="false" id="theIframe" />
                    <script>document.getElementById('theIframe').height = window.innerHeight - 210;</script>
                </div>

Can anyone please help on this?. Thanks.




 
Yogeshwar TailorYogeshwar Tailor
Hi Ravindar,

try frameBorder="0"  in your iframe
<apex:iframe src="{!ReportsTabularUrl}" scrolling="false" id="theIframe" frameBorder="0" />

Thanks,
Yogesh
sfdcMonkey.comsfdcMonkey.com
try this once : 
     <apex:iframe src="{!ReportsTabularUrl}" scrolling="false" id="theIframe" frameBorder="0" width="300" height="300"​/> 
change the width and height as per your requirement 

Thanks let us know if it helps you
Ravindar AdminRavindar Admin
Hi @Yogeshwar Tailor and {!Piyush_soni__c},

I have changed the code as you suggested as below, But, Still report is appearing with rectangle line.
<div class="container">
                    <apex:iframe src="{!ReportsTabularUrl}" scrolling="false" id="theIframe" frameBorder="0" width="300" height="300"/>
                    <script>document.getElementById('theIframe').height = window.innerHeight - 210;</script>
                </div>
User-added image 
Yogeshwar TailorYogeshwar Tailor
Hi Ravindar, 
​<div class="container"> 
<apex:iframe src="{!ReportsTabularUrl}" scrolling="false" id="theIframe" frameBorder="false" width="300" height="300"/> 
<script>document.getElementById('theIframe').height = window.innerHeight - 210;</script> 
</div>
or you can try this.. 
document.getElementById("theIframe").style.border = "hidden"

Thanks,
Yogesh
Ravindar AdminRavindar Admin
Hi Yogeshwar Tailor,

I have tried with the below codes: 
<div class="container"> 
<apex:iframe src="{!ReportsTabularUrl}" scrolling="false" id="theIframe" frameBorder="false" width="600" height="300"/> 
<script>document.getElementById('theIframe').height = window.innerHeight - 210;</script> 
</div>
and 
<div class="container"> 
<apex:iframe src="{!ReportsTabularUrl}" scrolling="false" id="theIframe" frameBorder="false" width="600" height="300"/> 
<script>document.getElementById('theIframe').height = window.innerHeight - 210;</script> 
<script>document.getElementById("theIframe").style.border = "hidden"</script> 

</div>
Still the report is in Box.
User-added image​