emurray100
Posts: 5
Joined: Sat Feb 26, 2011 10:13 pm

jquery ui dialog resize

I noticed that graphs don't automatically resize when displayed in a jquery-ui dialog however they DO resize when the window is resized so...

If you want your graphs to resize when a dialog is resized the simplest way I've found to do it is to bind a window resize call to the dialog resize stop as follows:

Note: I'm binding the function to the dilogresizestop event with my namespace highchartGraphs so I can clean up just this function later.

Code: Select all

  $j(masterDivRef).closest(":ui-dialog").bind('dialogresizestop.highchartGraphs',function(event,ui) {
    $j(window).resize();
  });
To remove the function when the dialog is closed I can do the following since I used the highchartsGraphs namespace

Code: Select all

     $j(masterDivRef).closest(":ui-dialog").bind('dialogclose.removeGraphs',function(event,ui) {
       $j(this).unbind('dialogresizestop.highchartGraphs');
     });
Cheers!
-Ed

Return to “Highcharts Usage”