Opened 2 years ago

Closed 2 years ago

Last modified 2 years ago

#19021 closed defect (invalid)

dijit/layout/ContentPane does not resize when adding widgets as children

Reported by: GibboK Owned by:
Priority: undecided Milestone: tbd
Component: Dijit Version: 1.12.2
Keywords: Cc:
Blocked By: Blocking:

Description

Steps to reproduce issue:

  1. Open test case at https://jsfiddle.net/gibbok/wy5df86v/
  2. Click 10 times button "Click me many times!".

Issue:

  1. dijit/layout/ContentPane does not resize when adding widgets as children.
  2. Content inserted is not fully visible.
  3. There is no option to show or not a scrollbar.

Desired behavior:

  1. Dimensions for dijit/layout/ContentPane should increase in order to accommodate new added widgets. All inner widgets should be visible.
  2. Would be nice to have an option to show/hide scrollbar programmatically.

Change History (4)

comment:1 Changed 2 years ago by GibboK

  • Issue visible on dojo 1.12.1 and dojo 1.10.4

comment:2 Changed 2 years ago by bill

Component: GeneralDijit
Resolution: invalid
Status: newclosed

The ContentPane? isn't changing size because you explicitly set the size to 125px.

As for the scrollbar, that's controlled via the CSS overflow property.

comment:3 Changed 2 years ago by GibboK

Thanks for your comment, unfortunately the problem persists even after removing height of 125px.

Live example https://jsfiddle.net/wy5df86v/5/

A related question/answer on SO:

http://stackoverflow.com/questions/43917164/possible-bug-dijit-layout-contentpane-does-not-resize-when-adding-widgets-as-c

Please consider re-open this ticket.

require(["dijit/layout/ContentPane", "dijit/TitlePane", "dijit/form/Button", "dojo/domReady!"], function(ContentPane, TitlePane, Button) {
  this._contentPanel = new ContentPane({
    style: "background-color:red;"
  }, "contentPanel");

  this._titlePanel = new TitlePane({
    title: "I'm a TitlePane",
    content: "Collapse me!"
  }, "titlePanel");

  this._button = new Button({
    label: "Click me many times!",
    onClick: function() {
      this._titlePanel.addChild(new Button({
        label: "Test",
        style: "width: 250px"
      }));
    }.bind(this)
  }, "button");

  this._contentPanel.addChild(this._titlePanel);
  this._titlePanel.addChild(this._button);
  this._contentPanel.startup();
});

comment:4 Changed 2 years ago by bill

Ah.... yes, it's the TitlePane? that has a fixed height but I guess that's set by the ContentPane?. I think you just need to set the ContentPane?'s doLayout flag to false.

Note: See TracTickets for help on using tickets.