Как прикрепить «указатель» на элемент DOM к лайтбоксу вместо его копирования? - PullRequest
Новая
       10

Как прикрепить «указатель» на элемент DOM к лайтбоксу вместо его копирования?

0 голосов
/ 30 октября 2009

У меня есть сложная форма ввода в веб-приложении на основе PHP. Чтобы немного его структурировать, я ввел «Многогранный лайтбокс» , чтобы части формы - именованные встроенные DIVs с «display», установленным в «none», - появлялись в диалоговом окне стиля «lightbox». Это прекрасно работает, до сих пор я понял, что когда он отображает DIV, он копирует его в центрированный DIV, вынимая его из формы - и все изменения входных форм, содержащихся в нем, теряются.

Код в коде mf_lightbox, который превращает встроенный DIV в центрированный диалог лайтбокса: 

showBoxByID : function(id, boxWidth, boxHeight) {
this.lightboxType = 'id';
this.lightboxCurrentContentID = id;
this.setLightboxDimensions(boxWidth, boxHeight);
var element = $(id);
var contents = $('mf_boxContents');
contents.appendChild(element);  // <!-- This is where it happens
Element.show(id);
this.showBox();
return false;
},

Кто-нибудь знает способ не копировать , но каким-то образом "прикрепить" div к слою boxContents, чтобы он оставался в форме по-домашнему? Как указатель на языке программирования? Этот mf_lightbox быстрый, отличный, и я бы очень хотел остаться с ним.

Я достаточно ясен? Вы понимаете, о чем я? Знаете ли вы альтернативы лайтбокс, которые делают это по-другому?

Заранее спасибо за ваши ответы!

1 Ответ

2 голосов
/ 30 октября 2009

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

// Save parent?
this.contentParent = element_to_be_inserted.parentNode;

и при закрытии переместите элемент обратно к родителю: 

// Move elements back to original location
if (this.contentParent != null)
 this.contentParent.appendChild($(this.lightboxCurrentContentID));
else
 body.appendChild($(this.lightboxCurrentContentID));

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

Недостатком, конечно, является то, что вы не можете обращаться к окружающей форме, используя this.form, пока ваши элементы находятся в лайтбоксе.

...