Повторное открытие окна в overlay tools
 

Взял для открытия всплывающих окон эту jquerную библиотеку - http://flowplayer.org/tools/demos/ov...al-dialog.html
Подключил к коду, открывается по получению запроса ajax по нажатию кнопки, один раз - отлично, нажимаю второй раз - ничего
Вот тестовую сделал страницу
http://nadlanbid.com/oleksiy/test
в консоле вывожу объект, что возвращается, так в двух ситуациях разное почему-то. Как исправить и почему такое происходит?

$(document).ready(function() {
	$("#update_details").click ( function()  {
		
		var fields =$(this.form).serializeArray();
		$.post("pers_det/update_details", fields,
		function(data) {
			if (data.success)
			{
				$("#sys_mes_short_text").html(data.success);
				var v = $("#sys_mes_short").overlay({
					closeOnClick: false,
					load: true
					});
				console.log(v);
				console.log($("#sys_mes_short"));
			}
		}, "json");
	} );
	
});

Лог
POST http://nadlanbid.com/oleksiy/pers_det/update_details
[div#sys_mes_short]
[div#sys_mes_short]

POST http://nadlanbid.com/oleksiy/pers_det/update_details
d { load=function(), close=function(), getOverlay=function(), ещё...}
[div#sys_mes_short]

Он просто скрывается, поищите в доках как его показать. Может прокати просто так $("#sys_mes_short").show()

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

Давайте посмотрим на простейший вариант использования из документации.

<!-- СОЗДАЁМ ТРИГЕРЫ ПРИ ЩЕЛЧКЕ ПО НИМ ПОЯВЛЯЕТСЯ ОВЕРЛЕЙ. При этом в тригере есть атрибут rel. -->
<div id="triggers">
	<img src="http://farm4.static.flickr.com/3651/3445879840_7ca4b491e9_m.jpg" rel="#mies1"/>
	<img src="http://farm4.static.flickr.com/3346/3449388113_71a06b8548_m.jpg" rel="#mies2"/>
</div>

<!-- Содержимое диалога находится в отдельном div
на содержимое ссылается атрибут  rel в тригере.
 -->
<div class="simple_overlay" id="mies1">
    Содержимое диалога.
</div>

<script>
// код вешает оверлей на тригер, при срабатывании тригера в оверлей будет вставлено содержимое из rel

$(document).ready(function() {
      $("img[rel]").overlay();
});
</script>

Здесь оаерлей создаётся только однажды, и сам отвечает за свой вызов.
А вы для каждого отображения пытаетесь создать свой оверлей. Улавливаете разницу ?

как варианты решения.

1) Путь Мудреца. наиболее правильный

а) повесить оверлей на кнопку, $("#update_details[rel]").overlay();
б) селектор элемента с содержимы оверлея указать в rel, <button rel="#myDialog" id="myButton">
в) post запрос делать внутри обработчика события оверлея onBeforeLoad(более удобное событие до
отрисовки оверлея), или onLoad (уже после того как оверлей на экране),
г) ответ на запрос, грузить в элемент указанный в rel, или в специальный контейнер (думаю это удачнее)
var wrap = this.getOverlay().find(".contentWrap");
wrap.html(data.success);
д) сам HTML оверлея

<div class="apple_overlay" id="myDialog">

	     <!-- the external content is loaded inside this tag -->
   	     <div class="contentWrap"></div>
      </div>

2) Путь камикадзе.

Каким то образом подчистить следы предыдущего оверлея перед созданием нового.
например при помощи $("#sys_mes_short").remove() - но я не могу гарантировать отсутствие утечек памяти, штатные
методы ликвидации увы отсутствуют.

Да прибудет с тобой сила !

Так, разницу понял, а вот совет недоконца.
у меня есть два разных окна, одно с id="sys_mes_short" для успеха и id="err_mes" для ошибки.
Вот мне не понятно как в такой ситуации решать какое окно показывать?
В data.success у меня возвращается не само окно, а лишь текст, который нужно прописать. Если data.error вернулось, то показываем другое окно с другим текстом. Вот как в такой ситуации это сделать лучше?

Я боюсь это не совет а единственная возможность, методов вроде open я не нашёл в документации )))

Собственно вот похожее демо. Исходники можно посмотреть при помощи нехитрых манипуляций с правой кнопкой.
http://flowplayer.org/tools/demos/overlay/external.htm

И окно у тебя на самом деле одно, а вот содержимое разное.

Если всё хорошо ты делаешьwrap.html(data.success);
Если всё плохо ты делаешь wrap.html("Ну вот. Операция неудалась, нам с тобой крышка");

Не, для ошибки оно красное, это другой див с другими классами, просто я его в тесте не использовал, так как думал что достаточно сделать с одним, а на второе оно и так распространиться

Короче вот теперь какая проблема.
Сделал как предложили, подгружаю окно в

<div id="popup" style="display:none">
<a class="close"></a>
<div class="contentWrap"></div>
</div>

использую событие onBeforeLoad, однако оверлей запускается до возврата ajax запроса. Что приводит к тому, что если возникает ошибка, то выводиться кнопка закрытия которую я повесил на close. Как-то можно по другому запускать?

Фух, вроде разобрался, есть событие load
короче создал hidden элемент, прописал в него rel
повесил на него оверлей
Код оставил старый, то есть отправка аякс запроса по клику, только теперь в месте показа вызываю функцию load() оверлея

Да, есть правда вопрос ещё, как затемнение делать?
Использую

$("#overlay[rel]").overlay({
		mask: {
			color: '#000',
			loadSpeed: 200,
			opacity: 0.9
		}
	});

Результат нулевой, в примерах вроде так же все делается ничего дополнительного нет... Может кто подскажет?