dojo Показать / скрыть одну панель контента, в то время как другая панель контента является жидкой - PullRequest
0 голосов
/ 02 октября 2011

Я боролся в течение нескольких недель, пытаясь взломать этот орех, поэтому я не уверен, невозможно ли это, или это мое отсутствие кодирования отбивных ... или и то, и другое. Я не программист, и я новичок в Dojo Toolkit.

У меня есть сайт, использующий макет BorderContainer. Я пытаюсь создать эффект, в котором я могу использовать кнопку, чтобы открывать и закрывать выпадающий список типов, который будет содержать элементы управления. Мне нужно, чтобы этот раскрывающийся список был скрыт при загрузке страницы, а затем открывался при нажатии кнопки.

Моя проблема в том, что когда я открываю выпадающий список, он выталкивает панель контента под ним из нижней части окна браузера. Мне нужно, чтобы нижняя ContentPane оставалась вписывающейся в оставшееся пространство окна браузера, когда открывается раскрывающийся список. Кроме того, я хочу, чтобы раскрывающийся список находился вне прокручиваемого контейнера для содержимого под ним, поэтому я настроил его так, чтобы он находился вне вложенного BorderContainer под ним.

Я создал упрощенную версию кода, чтобы продемонстрировать свою задачу (см. Ссылку ниже). Если вы загрузите страницу, вы увидите, что центр ContentPane прокручивает содержимое. Но если вы затем нажмете на кнопку, раскрывающийся элемент div развернется над содержимым. Затем, когда вы прокрутите страницу, вы заметите, что не можете видеть всю панель, потому что она находится на ничейной земле ниже нижней части окна браузера. Я предполагаю, что, поскольку div настроен для отображения: ни один при загрузке, его размер не учитывается при загрузке страницы. Затем, когда вы открываете его нажатием кнопки, его размер является аддитивным, и на панели ниже не видно, как изменить размер или учесть новый элемент.

Я пытался использовать атрибут видимости, но это оставляет пробел для div, когда он все еще закрыт. Я возился с некоторым кодом, который контролирует высоту, которая показывает обещание, но каждый из моих выпадающих окон будет иметь разные размеры, поэтому я бы предпочел, чтобы высота была установлена ​​на «авто», а не на заданный размер пикселя.

Кто-нибудь знает, как мне это сделать, чтобы нижняя панель помещалась в пространстве, не отрываясь от экрана?

Вот пример страницы:

http://equium.com/scaffold.html

(У меня были некоторые проблемы при попытке вставить здесь полную HTML-страницу в качестве примера кода, так что, если это предпочтительный способ справиться с этим, и кто-то может сообщить мне лучший способ встраивания всего этого кода, я был бы признателен она.)

Спасибо заранее, я бы очень признателен за любые отзывы.

Ответы [ 4 ]

2 голосов
/ 03 октября 2011

Возможно, вы захотите взглянуть на dojox.layout.ExpandoPane (хотя предупреждаю, я думаю, что какое-то время он работал только для верхней и левой областей).

Кроме того, я бы предложил упростить / изменитьваш макет немного.Смотрите пример здесь:

http://jsfiddle.net/taFzv/

(Вероятно, потребуется некоторая настройка, чтобы получить именно то, что вы хотите.)

Реальная проблема, с которой вы столкнулись, вероятно,что BorderContainer не имеет представления о том, что части представления изменились.ExpandoPane позаботится об этом, сообщив BorderContainer о перекомпоновке после завершения анимации.

1 голос
/ 15 марта 2012

Работает под IE8.0.Когда раскрывающийся список открыт, просто продолжайте нажимать кнопку мыши со страницы и перетаскивайте ее вниз, чтобы увидеть, как содержимое было перемещено со страницы.Похоже, что браузер не может обнаружить его и не может добавить его в учетную запись «полосы прокрутки».

0 голосов
/ 31 октября 2011

Может быть, dijit.form.DropDownButton будет соответствовать вашим потребностям. При нажатии на кнопку отображается всплывающая подсказка, которая может быть заполнена любым содержимым, которое вы хотите. Как вы указали, всплывающая подсказка отображается только при нажатии кнопки, и она вообще не мешает основному макету. Подсказка находится «сверху» страницы.

0 голосов
/ 04 октября 2011

Я бы посоветовал убрать все BorderContainers, кроме вашего первого уровня, с идентификатором mainPage.

Поместите свой div {stuff here} в mainPage BorderContainer, после ContentPane с помощью кнопки Закрыть / Открыть.Удостоверьтесь, что вы делаете это dojotype dijit.layout.ContentPane, устанавливаете layoutpriority и устанавливаете регион на вершину.Установите высоту 0 / x при нажатии кнопки «Открыть / Закрыть» вместо настройки отображения.

Попробуйте снова выполнить свою страницу.Если это не помогает, вам, вероятно, понадобится вызов макета, изменение размера или и то, и другое, чтобы указать BorderContainer, что ему нужно оценить все свои дочерние элементы и правильно выбрать размер центральной панели.Что-то вроде dijit.byId ("mainPage"). Layout ();Делайте это каждый раз, когда кто-то нажимает кнопку «Закрыть / Открыть», после того как вы изменили высоту дочерних элементов BorderContainer.

...