Javascript doesn't seem to work inside the content loaded in lightbox2

Question

I have created a comment form in a view and made it display as hidden so that I can make is appear in a lightbox using lightbox2.

The form mark up looks like this:

<div id="comment-form" class="hidden">
      <div id="comment-form-inner">
            ........form code goes here.....
      </div>
</div>

And then the link that open the lighbox looks like this:

<a href="*url* #comment-form-inner" rel="lightmodal" class="lightbox-processed">Add a review</a>

The the elements inside the div #comment-form-inner is displayed in the lighbox but some field doesn't seems to work such as the date picker field and the five star field. The date picker does not show up when the date text box field is active and the animated stars in the five star field just shows a select box.

Is there a way for the form fields to be able to render the javascript attached to those form elements?

Answer 1

First try updating lightbox to the latest jQuery version and see if that works. Here's someone who posted a similar question already: Jquery datepicker does not work inside lightbox

Answer 2

It is not loading because you have given the JavaScript functions in document.ready instead of that use on or live according to your jQuery version ,

$('.classname').on("click",function(){
     // your JavaScript to run
});

Or

You can load the lightbox as iframe.