带日期选择器的简单对话框

Question

我有一个jQuery的简单对话框，它很好用，但我在简单对话框中的文本字段之一无法看到datepicker插件？

感谢您的帮助！

<div style="display:none;" id="simpleDialog1"> 

<form> 
<fieldset> 
    <legend>Legend Name</legend> 
    <label for="DateCreated">Date:</label> 
    <input type="text" name="DateCreated" class="datepicker" /> 
     <label for="Status">Status:</label> 
    <input type="text" name="Status" /> 
     <label for="RequestedBy">Requested By:</label> 
    <input type="text" name="name" /> 
     <label for="AssignedTo">Assigned To:</label> 
    <input type="text" name="AssignedTo" /> 
     <label for="Description">Description</label> 
    <input type="text" name="Description" /> 
    <br> 
    <input type="submit" name="submit" /> 
</fieldset> 
</form> 
</div> 



$(document).ready(function() { 


$('#sdHc1').simpleDialog({ 
opacity: 0.3, 
duration: 500, 
title: 'Add Ticket', 
open: function (event) { 
    console.log('open!'); 
}, 
close: function (event, target) { 
    console.log('close!'); 
} 
}); 



$('.datepicker').datepicker(); 


}); 

我试过使用datepicker outwith对话框，它完美的作品？

谢谢你们！

Answer 1

datepicker控件可能出现在对话框的后面。尝试应用CSS样式将其带到使用z-index属性前面：

<style type="text/css"> 
    #ui-datepicker-div 
    { 
     z-index: 9999999; 
    } 
</style> 

这个解决方案和更多信息可以在这里找到： http://www.west-wind.com/weblog/posts/2009/Sep/12/jQuery-UI-Datepicker-and-zIndex