Как добавить нижний колонтитул во всплывающий диалог в JQuery?

Question

Я пытаюсь создать всплывающее окно с помощью диалога jqueryui. Я пытаюсь добавить нижний колонтитул после содержимого в диалоговом окне.

мой диалог должен выглядеть как

<popup>
 header-html
 content-html
 footer-html
</popup>

Диалог уже имеет заголовок, и я могу поместить содержимое в div. Но как я могу добавить нижний колонтитул HTML ??

Я хочу, чтобы этот колонтитул присутствовал во всех всплывающих окнах на сайте.

Answer 1

Просто разделите ваш текущий контейнер содержимого на div содержимого и нижнего колонтитула:

<div class="dialogContent">
   <div class="content">Your existing content</div>
   <div class="footer">The common footer stuff</div>
</div>

Затем поместите это в содержание диалога.

Answer 2

вот как я это делаю ... это не стилизовано, но если вы хотите, это как бы сделать это.

если вы превратите слой с классом "mypopup" в диалог,тогда вы можете сделать следующее:

$('.mypopup').parent().append('<div id="footer" style="position:absolute;display:none;bottom:0;float:left;width:98%;background-color:#c9c9c9;padding:5px;"></div>');

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

Answer 3

Как выглядит ваш HTML? Я бы вообразил что-то вроде этого:

<div class="popup">
   <div class="header"></div>
   <div class="content"></div>
   <div class="footer"></div>
</div>

... и тогда ответ на ваш вопрос - «точно так же, как вы помещаете контент в заголовок и разделы контента».

В JQuery это было бы что-то вроде:

$(".footer").html("Hello World!");