在对话框窗口打开jQuery UI DatePicker打开
我正在显示一个jQuery UI对话框窗口,其中包含一个jQuery UI日期选择器控件。问题在于对话窗口上的第一个窗体字段是日期选择器,因此当窗口打开时会收到焦点,从而导致日期选择器窗口自动打开。我不希望发生这种情况。在对话框窗口打开jQuery UI DatePicker打开
我已经打过电话
$('#Date').datepicker('hide')
在对话窗口中,然后打开功能,并且也使对话框打开,但它不为工作所达到的代码时的代码中,日期选择器窗口后ISN还没打开。
如何使日历选择器窗口在对话窗口显示时不打开,但当用户单击输入时仍然打开日期选择器窗口?
您可以使用图标触发:http://jqueryui.com/demos/datepicker/#icon-trigger
而且,如果需要的话,防止用户在键入日期。
我用日期选择器创建了一个对话框的小提琴,但无法在FF或Chrome中复制问题。知道它发生在IE中。
$(".datepicker").datepicker({
dateFormat: 'yy-mm-dd '
});
$(".datepicker").datepicker("disable");
$("#dialog").dialog({
width: 400,
modal: true,
open: function(event, ui) {
$(".datepicker").datepicker("enable");
}
});
基于以前的答案:How to blur the first form input at the dialog opening
不知道这是一个jsfiddle问题,但如果你把它放在一个正常渲染的页面中,它也发生在Chrome中。 –
@NickOlsen这是关注第一个元素的对话框。 jquery ui团队有一张票可以修复。与此同时,我更新了我的答案和小提琴。 –
这有点烦人。但是,我猜你在空闲时不会抱怨太多!:) –
当您定义对话框时,您可以指定在打开时获得焦点的元素。将焦点设置到不同的元素在对话框
$('#myDialog').dialog({
open: function (event, ui)
{
$('#myInputBox').focus();
}
});
您也可以把您的来电隐藏在打开的事件代码的日期选择器。
我尝试了这两个想法,正如描述中提到的那样,但它没有奏效。我在打开的函数上放置了一个断点,并且datepicker窗口在此时未打开。它在打开函数执行后打开。 –
您可以禁用日期选择器时,对话框未打开。
$('#datepicker').datepicker({
...
disabled: true
});
$('#dialog').dialog({
open: function(event, ui) {
$('#datepicker').datepicker('enable');
},
close: function(event, ui) {
$('#datepicker').datepicker('disable');
},
...
});
看到这个在行动:http://jsfiddle.net/william/Rf37h/1/。
我试过了,但没有工作,你能给完整的源代码吗? –
完整的源代码位于演示网站:http://jsfiddle.net/william/Rf37h/1/。 –
我看到它,但是当从一个单独的文件中调用时,它不起作用。我们只需要包含jquery1.6.3? –
尝试这一行代码
$(document).ready (function() {
$('#dialog_modal_body').on("click", ".datepicker", function(){
$("#ui-datepicker-div").css("z-index", "100000");
});
});
前添加一个隐藏的元素,它会尝试自动聚焦功能。
这将使您的日期选择器在打开对话框时不被重点关注。
<span class="ui-helper-hidden-accessible"><input type="text"/>Prevents autofocus from opening start datepicker on dialog load</span>
的可能重复的[如何模糊在对话框开口中的第一形式的输入(http://*.com/questions/5418138/how-to-blur-the-first-form-input-at -the-dialog-opening) – Teepeemm