jquery datepicker -当两个日期在相同的形式时发生冲突

jquery datepicker - Conflict when two dates in same form

本文关键字:冲突 日期 datepicker 两个 jquery      更新时间:2023-09-26

我有一个有两个日期字段的表单。这是一个相当大的表单,所以我只展示相关的部分。

<input id="dateofassessment" name="dateofassessment"  readonly="readonly" class='datebox' />
<input id="LastIncident" name="LastIncident" readonly="readonly" class="datebox" />

(我应该指出,"评估日期"是表格中的第一项,"LastIncident"是最后一项)

我像这样附加datepicker对象…

    $(".datebox").datepicker({
        dateFormat: 'dd-M-yy',
        changeYear: true,
        showButtonPanel: false
        });

"评估日期"输入框工作正常。日历显示OK,点击一个日期填充"评估日期"字段-完美!

然而,"LastIncident"框不能很好地工作。单击它将显示日历OK。但是,选择日期并不会填写表单。事实上,日历在"LastIncident"处关闭,并在"dateofassessment"字段上重新打开,只要我选择一个日期。

我不能在一个内部网站上发布全部代码,因为有大量的代码。但希望我已经发布了相关的部分。

仅供参考,字段是"只读"的事实没有任何区别。

版本……jQuery v1.5.1Datepicker 1.8.9

这显然是日期选择器的错误。而不是使用

$(".datebox").datepicker({
        dateFormat: 'dd-M-yy',
        changeYear: true,
        showButtonPanel: false
        });

$("#dateofassessment").datepicker({
        dateFormat: 'dd-M-yy',
        changeYear: true,
        showButtonPanel: false
        });
$("#LastIncident").datepicker({
        dateFormat: 'dd-M-yy',
        changeYear: true,
        showButtonPanel: false
        });

我知道这会让你重复自己的话,这是不好的,但它可以帮助解决问题。或者你可以试试另一个日期选择器。或者将这个更新为新版本

您的问题位于其他地方,请参阅此提琴,它按预期工作:http://jsfiddle.net/AfmpL/

你也可以使用。setdefaults使所有的日期选择器的行为相同(我有我的主页,甚至不是在OnDocumentReady,因为我希望它在OnDocumentReady函数之前运行)。

$.datepicker.setDefaults({
    showOn: "button",
    buttonImage: "/Program/Images/calendar.png",
    buttonImageOnly: true,
    buttonText: ""
})

因此,你就不需要重复那么多了。

$("#dateofassessment").datepicker();
$("#LastIncident").datepicker();

尝试使用这个JavaScript:

$(function() {
    $( "#datepicker" ).datepicker();
    $( "#datepicker" ).datepicker( "option", "dateFormat", "yy-mm-dd" );
});
$(function() {
    $( "#datepicker2" ).datepicker();
    $( "#datepicker2" ).datepicker( "option", "dateFormat", "yy-mm-dd" );   
});

然后使用以下表单字段:

<input type="text" id="datepicker" name="fecha_ingreso" />
<input type="text" id="datepicker2" name="fecha_ingreso2" />