Jquery popup stops the ajax in the form fields

Question

I have created a .js script that creates a popup box next when a button is clicked. This pop shows a lost of the different content types you can add from that popup. When you click on one of those links it will load the form elements through AJAX. That is all working great but there is a major problem.

The AJAX fields within the form that is loaded onto the the popup does not work itself, I can enter in some text but no AJAX is performed. The field type of the that field is an entity reference field.

Can anyone help me on this one please? Thank you in advance!

Answer 1

Maybe not the answer you're looking for, but things would probably work if you load the form page within a iframe. I've used this approach successfully with forms that have AJAX fields. In D7 the admin overlay is also built using iframes.

Answer 2

I solved the problem by loading the #content-inner div instead of for example the #example-content-type-node-form div. This seemed to allow me to use the ajax and easily theme the popup. Here is the line of code below within the AJAX function:

$('.popup-wrap .popup-form').html($(data).after('#content-inner'));