Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Dojo/Dijit TitlePane

How do you make a titlePane's height dynamic so that if content is added to the pane after the page has loaded the TitlePane will expand?

like image 309
Robert Johnstone Avatar asked Aug 11 '26 12:08

Robert Johnstone


2 Answers

It looks like the rich content editor being an iframe that is loaded asynchronously confuses the initial layout.

As @missingno mentioned, the resize function is what you want to look at.

If you execute the following function on your page, you can see that it does correctly resize everything:

//iterate through all widgets
dijit.registry.forEach(function(widget){
    //if widget has a resize function, call it
    if(widget.resize){
        widget.resize()
    }
});

The above function iterates through all widgets and resizes all of them. This is probably unneccessary. I think you would only need to call it on each of your layout-related widgets, after the dijit.Editor is initialized.

The easiest way to do this on the actual page would probably to add it to your addOnLoad function. For exampe:

    dojo.addOnLoad(function() {
        dijit.byId("ContentLetterTemplate").set("href","index2.html");
        //perform resize on widgets after they are created and parsed.
        dijit.registry.forEach(function(widget){
              //if widget has a resize function, call it
              if(widget.resize){
                  widget.resize()
              }
        });
    });

EDIT: Another possible fix to the problem is setting the doLayout property on your Content Panes to false. By default all ContentPane's (including subclasses such as TitlePane and dojox.layout.ContentPane) have this property set to true. This means that the size of the ContentPane is predetermined and static. By setting the doLayout property to false, the size of the ContentPanes will grow organically as the content becomes larger or smaller.

like image 178
BuffaloBuffalo Avatar answered Aug 13 '26 20:08

BuffaloBuffalo


Layout widgets have a .resize() method that you can call to trigger a recalculation. Most of the time you don't need to call it yourself (as shown in the examples in the comments) but in some situations you have no choice.

like image 37
hugomg Avatar answered Aug 13 '26 18:08

hugomg



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!