0

我这样称呼内联日期选择器（用于演示目的的简化版本）：

<input id="inp_datepicker" name="startDateField">
<div id="datepicker"></div>

<input id="inp_datepicker2" name="endDateField">
<div id="datepicker2"></div>

我已将此添加到 Javascript 中，以便他们将选择结果放入可编辑字段中。

$("#datepicker").datepicker({
    onSelect: function() { 
        var dateObject = $(this).datepicker('getDate');
        $('#inp_datepicker')[0].value = convertDateToString(dateObject);
    }
});

$("#datepicker2").datepicker({
    onSelect: function() { 
        var dateObject = $(this).datepicker('getDate');
        $('#inp_datepicker2')[0].value = convertDateToString(dateObject);
    }
});

一切正常，除了第二个日期选择器没有填充第二个字段。第一个，没问题。第二个，什么都没有。

我在第二个 onSelect 函数中设置了一个断点，发现它根本没有中断。

（我知道，我可以通过让输入弹出日历来规避这个问题，过去一切都很好，但是这次 PRD 指定了内联日期选择器，所以我必须将选择的结果分配给一个字段。 ) 同样，第一个工作正常。

编辑从 div 中删除class="hasDatepicker"，因为它不在源代码中，仅在 jQuery-UI datepicker 执行其操作后呈现的标记中。

编辑 2我很尴尬地说我自己已经解决了这个问题。它似乎与另一个与日期选择器无关的不相关脚本有关。删除该脚本后，一切正常，即使该脚本没有抛出任何错误。啊，如果没有遗留代码，我们该怎么办，是吗？另外，我认为最好删除这篇文章，这样就没有人再浪费时间了。抱歉，添麻烦了。

4

2 回答 2

1

似乎问题源于 class .hasDatepicker。

<div id="datepicker" class="hasDatepicker"></div>
<div id="datepicker2" class="hasDatepicker"></div>

当你打电话时.datepicker()，它会自动添加.hasDatepicker。如果该类已经存在，那么它将假定已添加 datepicker。

示例：http: //jsbin.com/ukotit/27/edit

从divs 中删除类，它应该可以工作。

$("#datepicker").removeClass('hasDatepicker').datepicker({
    onSelect: function() { 
        var dateObject = $(this).datepicker('getDate');
        $('#inp_datepicker')[0].value = convertDateToString(dateObject);
    }
});

$("#datepicker2").removeClass('hasDatepicker').datepicker({
    onSelect: function() { 
        var dateObject = $(this).datepicker('getDate');
        $('#inp_datepicker2')[0].value = convertDateToString(dateObject);
    }
});

演示：http: //jsbin.com/ukotit/30/edit

更新：

$("#datepicker, #datepicker2").datepicker({
    onSelect: function(dateText, inst) { 
      $(this).prev()[0].value = dateText;
    }
});

http://jsbin.com/ukotit/32/edit

于 2013-04-12T17:53:52.077 回答
0

你在 div 上有你的日期选择器而不是输入。

您可以将其更简单地修改为：

将数据添加到 elemnet 并使用它。

<input id="inp_datepicker" data-relatedelementid="datepicker" type="text" name="startDateField">
<div id="datepicker" class="hasDatepicker"></div>
<input id="inp_datepicker2" data-relatedelementid="datepicker2"  type="text" name="endDateField">
<div id="datepicker2" class="hasDatepicker"></div>

$("#inp_datepicker,#inp_datepicker2").datepicker({
    onSelect: function (dateText, inst) {
        $('#'+$(this).data('relatedelementid')).text(dateText);
    }
});
于 2013-04-12T17:57:43.860 回答