Как сделать высоту аккордеона dijit динамичной

StackOverflow https://stackoverflow.com/questions/1364140

  •  20-09-2019
  •  | 
  •  

Вопрос

Я не могу понять, как сообщить accordioncontainer установить высоту своей панели accordion в значение auto, чтобы высота панели была динамической в зависимости от ее содержимого.

В следующем коде я добавляю две панели в accordioncontainer.Один имеет высоту 10 пикселей, а другой - 90 пикселей, но в обоих случаях высота панели аккордеона рассчитывается как 10 пикселей.Похоже, он всегда занимает высоту первого. 

var accordionContainer = new dijit.layout.AccordionContainer({'id':'accContainer'}).placeAt("test");
var accordPane = new dijit.layout.ContentPane({"title": "test", "content":"<div style='height:10px'>sdfsdfsdf</div&gt;"});
var accordPane2 = new dijit.layout.ContentPane({"title": "test1", "content":"<div style='height:90px'>sdfsdfsdf</div>"});

accordionContainer.addChild(accordPane);
accordionContainer.addChild(accordPane2, 1);
accordPane.startup();
accordPane2.startup();
accordionContainer.startup();
accordionContainer.selectChild(accordPane2);

Я использую dojo 1.3.2

Это было полезно?

Решение 2

Я переопределил функцию _getTargetHeight в dijit.layout.AccordionContainer и всегда возвращаю 'auto' для высоты.Анимация раздвижных панелей будет работать некорректно, но это не так заметно.

_getTargetHeight: function(/* Node */ node){
// summary:
//For the given node, returns the height that should be
//set to achieve our vertical space (subtract any padding
//we may have).
//This is used by the animations.

//var cs = dojo.getComputedStyle(node);
//return Math.max(this._verticalSpace - dojo._getPadBorderExtents(node, cs).h, 0);
return 'auto';
}

Другие советы

В настоящее время это невозможно.Я написал блог / пример кода, чтобы объяснить, почему и как сгенерировать группу TitlePane, которые расширяются до их естественной высоты (а не высоты контейнера для AccordionContainer):

http://www.sitepen.com/blog/2008/10/21/quick-fixes-and-dojo-support/

Для этого требуется создать один виджет TitleGroup (пользовательский, код в блоге) и разместить внутри него TitlePane.Каждый из них ведет себя в основном как AccordionPane (с атрибутами title = "", возможностями загрузки href = "" и т.д.) И делегирует щелчки по заголовку для управления открытым / закрытым состоянием братьев и сестер.

попробуйте настроить размеры самого контейнера Accordion на размер, достаточный для размещения вашего контента плюс необходимых заголовков, например

#accContainer{
  height: 120px;
  width: 200px;
}

Вызов startup() в контейнере должен запустить дочерние панели для вас.

Теперь вы также можете просто использовать dijit.TitlePanes вообще без контейнера.Вы можете пройти open: false когда вы создаете экземпляры панелей, для начала они должны быть закрыты.Я думаю, заключив их в dojox.widget.TitleGroup будет имитировать поведение при одновременном открытии 1 устройства.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top