如果在AJAX之后实例化,则Datepicker不会选择任何日期

时间:2012-05-16 14:42:47

标签: jquery jquery-ui datepicker

确实发现了一个奇怪的错误。

Datepicker按预期正常工作,直到我通过AJAX加载一个对象,然后将datepicker附加到它上面,如下所示:

    $(".object").datepicker({
    showOn: 'both',
    buttonImage: '/images/icons/silk/calendar.png',
    dateFormat: "mm/dd/yy",
    changeMonth: true,
    changeYear: true,
    buttonImageOnly: true,
    yearRange: "2010:2030"
    onSelect: function(dateText, inst) {
      console.log('this was tapped.');
      console.log(dateText);
      console.log(inst);
    }
    })

如果我点击输入或图标,会弹出日期选择器。但是如果我选择了任何东西,则datepicker会关闭,而输入中的日期也不会改变。

更新

更奇怪的是。我使用上面的console.log电话进行了更新,他们都返回正确。然而,我输入的日期并没有改变。

更新

我认为这里可能发生的事情是页面上有几个常见的div具有相同的唯一ID,因为它是一个可自我克隆的表单。

更新

以下是在JSFiddle中重新创建的错误:http://jsfiddle.net/vMhrg/

2 个答案:

答案 0 :(得分:7)

您的ID重复似乎是一个问题。 ID 不能在页面上使用多次,考虑添加计数器(就像我在固定代码中那样)或者如果可以的话,将其全部删除。

http://jsfiddle.net/vMhrg/1/

代码(其他一切都是一样的):

<input type="text" value="05/08/2012" size="10" rel="Recurring End Date" name="task[scheduled_at]" id="task_scheduled_at_1" class="date-single-view">

<br />
<br />
<div class="item">
<input type="text" value="05/08/2012" size="10" rel="Recurring End Date" name="task[scheduled_at]" id="task_scheduled_at_2" class="date-single-view">
</div>

答案 1 :(得分:1)

你在.item和.date-single-view上都调用了datepicker(),它们是dom中的嵌套元素(根据下面的小提琴),这可能不太好想法 - 在div 输入字段上调用datepicker,但不能同时调用两者。

<div class="item">
   <input type="text" value="05/08/2012" size="10" rel="Recurring End Date" name="task[scheduled_at]" id="task_scheduled_at" class="date-single-view">
...