Ouvrir Datepicker situé à l'intérieur du dialogue

Question

de Possible en double:
Trouble with jQuery Dialog and Datepicker plugins

Au moment où j'ai la boîte de dialogue définie comme:

$('#dialogCl').dialog({ 
    autoOpen: false, 
    width:650, 
    height:550 
    }); 

Et le datepicker défini à l'intérieur #dialogCl comme:

$("#c").datepicker({showOn: 'button', buttonImage: 'images/calendar.gif', buttonImageOnly: true}); 

J'ai besoin d'ouvrir le datepicker mais il semble qu'il place le datepicker sous la boîte de dialogue.

J'ai trouvé quelques messages ici concernant cela, mais je ne ai pas su où comment définir le z-index de la .ui-datepicker à 1003 programaticly

Answer 1

J'ai eu le même problème - ma solution était d'ajouter un z-index jquery -ui * .css pour .ui-datepicker.

Vous pouvez essayer quelque chose comme $('.ui-datepicker').css({'z-index': 1003}) si vous n'avez pas accès (ou ne voulez pas modifier) ​​votre fichier css.

Answer 2

Dialog a une option zIndex que vous pouvez utiliser

$('#dialogCl').dialog({ 
    autoOpen: false, 
    width:650, 
    height:550, 
    zIndex: 800 
    }); 

Answer 3

Ma meilleure réponse est de définir l'interface utilisateur datepicker au-dessus de toutes les couches de dialogue :)

.ui-datepicker 
{ 
    z-index : 9999; 
} 

Answer 4

Il semble que le datepicker devrait soit lieu lui-même en plus de tout ce qui est visible puisque c'est un flyout, ou il devrait accepter un paramètre zIndex comme le fait le dialogue.

Est-ce que c'est le cas? Jusqu'à présent, le hack css montré ici ($('.ui-datepicker').css({'z-index': 1003})) est le seul qui a fonctionné.

Merci!