Do you initialise your datepicker after the modal dialog is created?

How are you displaying your modal window?

If you can provide a URL to an example page (stripped down if necessary) then I may
be able to help more,

Cheers,

Kelvin :)

The issue is with the z-index of the datepicker.
The modal dialog has a z-index of 1001 for the overlay, 1002 for the dialog, and the
datepicker possesses no z-index. There also does not appear to be an easy way to set
the z-index of the datepicker.

(a quick fix would therefore be to set the z-index of the datepicker to 1003 or
something)

You can set the x-index for the date picker popup to anything you like. See
datePicker.css line 73... Just change this number in your local version of the date
picker CSS!

Thanks :) - lol (already done)
I guess I didn't mention that part ... for me the line number was different as I'm
using the full jqueryui of which this included. I modified the ui-datepicker class
(adding a z-index of 1003).

This doesn't fix it entirely though :(. I was still seeing this problem on any
subsequent dialogs. This is because subsequent dialogs can have a higher z-index. By
going extreme and setting the z-index at 1600 I've so far not seen any further issues.

Hi,

Ahh - I can't speak for the jQuery UI datepicker. This is the support system for my
datepicker which predates the jQuery UI one... Unfortunately they decided to use the
same name which contributes to a fair amount of confusion...

This "multiple dialog" situation is interesting though. I may consider adding
functionality to my date picker which will check the z-index of the container of the
triggering element and try to appear above that...

Cheers,

Kelvin :)

I encountered a similar problem while using the JQuery UI datepicker,I had to edit
the ui.datepicker.css file, replace this
.ui-datepicker { width: 17em; padding: .2em .2em 0 }
with .ui-datepicker { width: 17em; padding: .2em .2em 0; z-index:3 }
setting  the z-index to 3 was appropriate for mine since i only had 2 popped up
elements, just set the z-index to whatever is appropriate. 

I encountered a similar problem while using the JQuery UI datepicker,I had to edit
the ui.datepicker.css file, replace this
.ui-datepicker { width: 17em; padding: .2em .2em 0 }
with .ui-datepicker { width: 17em; padding: .2em .2em 0; z-index:3 }
setting  the z-index to 3 was appropriate for mine since i only had 2 popped up
elements, just set the z-index to whatever is appropriate. 

Thanks for the comment but as mentioned above, this isn't the issue list for the
jQuery UI datepicker!

you can add one modal dialog atop another without any z-index issue. but once you
want to make an input field connect with a datepicker, the datepicker is deep below
all other dialogs. this - honestly - is a bug wrt jquery-ui.
patching the official .css files by adding a fixed z-index might be a workaround, but
can't be a proper solution.

i'd welcome if the jquery-ui devs would come up with a more appropriate solution than
this.

TY 4 aLL

Best way is:
Find de *.css for the Jquery ui, in use.

[Original] .ui-datepicker { width: 17em; padding: .2em .2em 0 }
[Modify]   .ui-datepicker { width: 17em; padding: .2em .2em 0; z-index:9999; }

I'd vote to have this *fixed* upstream, so, that we don't have to post-fix it ourself
on each jquery update.

To re-iterate:

The jquery-ui date picker is a different component. This is the repository and issue
list for my jQuery date picker (
http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/ ) - a completely
different component which predated the jQuery UI one. If you are using the jQuery UI
datepicker you should use their mailing list to report problems.