Home/ Questions/Q 966961
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-16T02:14:30+00:00

After some problems solved, I got a tricky stuff. I am using an overlay

  • 0

After some problems solved, I got a tricky stuff. I am using an overlay plugin for JQuery called prettyPhoto.

Just wanna make an overlay with a form. The form is hidden with CSS, and when a link is clicked, the overlay shows it in a nice fashion.

So far so good, everything working as expected, except only one thing: this form has a date field, in which I use datepicker UI.

It (the datepicker) does no shows up at all. At first, I tryed googling and making some CSS adjustments… nothing works. z-index on CSS, z-index dynamically…

Then I used Firebug to keep an eye. Datepicker usually sets its properties just when the listener element is clicked, dynamically. On this form inside the overlay, when I click the listener field, the datepicker div does not change at all.

Any ideas on how get this working?

References:
site is: http://davedev.com.br/projects/jdc/v1/pt/reserva.php
Yes, it is in portuguese. Just click the cartoon dialog box on bottom right side of screen to see the overlay.

I am using google apis CDN for jquery and jquery-ui.

I am developing and testing upon Ubuntu, Firefox 3.6.7 (Chrome 5 and Opera 10.60).

And yes, I am using some HTML5 elements and some CSS3 effects (the cartoon dialog baloon is fully made with CSS3. No images. =]).

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Your overlay plugin ‘prettyPhoto’ create a new DOM everytime it is triggered, so the ‘focus’ event that datepicker is bounded to, does not exist on the DOM element in your lightbox.

    Here is one person who had the same problem:

    jQuery live() failing with jQuery UI datepicker

    You’ll probably need something like this:

    $('#overlayData').live('click', function (){
  $(this).datepicker({dateFormat: 'dd/mm/yy'});
});
    • 0