Don Kitchen

programming, technology, fatherhood and life

Posts Tagged ‘javascript’

Dynamically re-size an iFrame’s height across browsers

July 8th, 2009

A while back I had a need to dynamically re-size an iFrame’s height and found a solution using a jQuery plug-in called autoHeight. What I later found was that this solution provided poor results with Internet explorer when my iFrame’s contents were fairly large and frequently changing (i.e. via navigation inside the iFrame).

It took quite a bit of tinkering but I was able to come up with a solution that works (and works well) in IE, Firefox, Safari and Chrome. It still uses jQuery but doesn’t depend on a plug-in. Here’s the code in case you’re looking for the same thing:

First, the iFrame…

<iframe src="Page1.htm" id="MyFrame" 
frameborder="0" marginheight="0" marginwidth="0" 
width="800px" height="100px" scrolling="no"></iframe>

Next, the JavaScript to resize it…

<script type="text/javascript">
 
     function sizeFrame() {
          jQuery("#MyFrame", top.document).css({ height: 0 });
          var heightDiv = jQuery("#MyFrame", top.document).contents().find('body').attr('scrollHeight');
          jQuery("#MyFrame", top.document).css({ height: heightDiv });
     }
 
     jQuery(function() {
          sizeFrame();
          jQuery("#MyFrame").load(sizeFrame);            
     });
 
</script>

This line is needed to initially initialize the height so that it works in Safari and Chrome. Without this line the window will never shrink to fit smaller content, it will just retain the last biggest height.

jQuery("#MyFrame", top.document).css({ height: 0 });

1 comment »

Posted in JavaScript, programming

Tags: iframe javascript jquery

JavaScript Reporting Services ReportViewer control error fix

December 8th, 2008

I have been going back and forth banging my head against a wall trying to fix a JavaScript error that was happening on my Reporting Services ReportViewer control when the View Report button is clicked. The error was a JavaScript error and seemed to be related to using something AJAX related on the same page as the ReportViewer control, but it took me a while to figure out what it was and fix it. All of the problems I saw on the web related to using either an AJAX update panel or one of the extenders in the AJAX Control Toolkit. Unfortunately for me I wasn’t using either one of them so trying to figure this one out was tricky.

The specific JavaScript error was:

Microsoft JScript runtime error: ‘this._postBackSettings.async’ is null or not an object

My page was setup where I had a master page with an AJAX menu on it (Radmenu to be specific). In order to use the Radmenu you need a ScriptManager object. Other than the menu, I didn’t have any AJAX related controls on either the master page or the content page.

What I eventually figured out was that my report pages (which use a base class) needed to disable partial rendering. To do this, you must do it in your page’s init event. If you do it after the init you’ll get an invalid operation exception. Here’s the code in the base class (you can put this in your code behind if you’re not using a base class):

    Private Sub Page_Init1(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init
 
        ' Make sure this page has a master page
        If Not IsNothing(Me.Master) Then
 
            Dim masterScriptManager As ScriptManager
            masterScriptManager = CType(Master.FindControl("MasterScriptManager"), ScriptManager)
 
            ' Make sure our master page has the script manager we're looking for
            If Not IsNothing(masterScriptManager) Then
 
                ' Turn off partial page postbacks for this page
                masterScriptManager.EnablePartialRendering = False
            End If
 
        End If
 
    End Sub

Just in case others stumble across this and are trying to solve their problem, here are some of the links I landed on when trying to solve the problem: