jQuery Datepicker:setDate不是函数

时间:2016-06-29 15:43:43

标签: jquery datepicker django-templates jquery-ui-datepicker typeerror

我目前正在尝试使内联的datepicker对象与日期输入进行交互,并且除了一件事之外还管理了所有内容。当我尝试使用输入的change事件时,它会抛出一个错误:

Uncaught TypeError: $.start_widget.setDate is not a function

我的Django模板/ jQuery代码如下所示,包含在插入文档头部的脚本标记中:

$(document).ready(function(){

  {% for string in datepickerstrings %}
    jQuery.{{ string }}_widget = $('#datepicker-{{ string }}');

    $.{{ string }}_widget.datepicker({
      inline: true,
      altField: '#event-{{ string }}',
      onSelect: function (date, instance) {
        $('#event-{{ string }}').val(date);
      }
    });
    $.{{ string }}_widget.hide();

    $('#event-{{ string }}').focusin(function () {
        $.{{ string }}_widget.show();
    });

    $('#{{ string }}-close').on("click", function (e) {
        e.preventDefault();
        $.{{ string }}_widget.hide();
    });

    $('#event-{{ string }}').change(function () {
        console.log("Changed date value from field: " + $(this).val());
        $.{{ string }}_widget.setDate($(this).val());
    });
  {% endfor %}

});

然后在发送到客户端之前对其进行处理(仅限相关循环):

$(document).ready(function(){


    jQuery.start_widget = $('#datepicker-start');

    $.start_widget.datepicker({
      inline: true,
      altField: '#event-start',
      onSelect: function (date, instance) {
        $('#event-start').val(date);
      }
    });
    $.start_widget.hide();

    $('#event-start').focusin(function () {
        $.start_widget.show();
    });

    $('#start-close').on("click", function (e) {
        e.preventDefault();
        $.start_widget.hide();
    });

    $('#event-start').change(function () {
        console.log("Changed date value from field: " + $(this).val());
        $.start_widget.setDate($(this).val());
    });

});

对我来说,这似乎是$.start_widget - 对象在更改事件处理程序之前已经明确定义和初始化,但它会抛出上述异常。 console.log来电显示正确的日期。

我也尝试用{:}替换setDate来电。

$.start_widget.datepicker( "setDate", $(this).val() );

然而,我得到了相同的结果。我一直试图弄清楚这几个小时,但似乎无法自己解决这个问题。我的代码出了什么问题?

编辑1:根据ImBack的建议,我得到了这个错误:

Uncaught TypeError: date.getDate is not a function
    _setDate @ ui.datepicker.js:1077
    _setDateDatepicker @ ui.datepicker.js:243
    (anonymous function) @ ui.datepicker.js:1426
    each @ jquery-1.8.3.min.js:2
    each @ jquery-1.8.3.min.js:2
    $.fn.datepicker @ ui.datepicker.js:1424
    (anonymous function) @ (index):66
    dispatch @ jquery-1.8.3.min.js:2
    u @ jquery-1.8.3.min.js:2

2 个答案:

答案 0 :(得分:0)

尝试以下方法:

$(document).ready(function () {
    var start_widget = $('#datepicker-start').datepicker({
        inline: true,
        altField: '#event-start',
        onSelect: function (date, instance) {
            $('#event-start').val(date);
        }
    });
    start_widget.hide();

    $('#event-start').focusin(function () {
        start_widget.show();
    });

    $('#start-close').on("click", function (e) {
        e.preventDefault();
        start_widget.hide();
    });

    $('#event-start').change(function () {
        console.log("Changed date value from field: " + $(this).val());
        start_widget.datepicker("setDate", $(this).val());
    });
});

我将您的widget存储在变量中,然后以正确的方式调用setDate

答案 1 :(得分:0)

我自己想出了问题。显然,唯一需要的是将$(this).val()转换为new Date($(this).val()),因为库无法将字符串解析为Date。这让我相信我有一个非标准版本的插件,因为文档清楚地说明了这一点:

  

setDate(date)

     

设置日期选择器的日期。新日期可以是Date对象或当前日期格式的字符串(例如,“01/26/2009”),从今天开始的天数(例如,+ 7)或一串值和句点(“y” “多年来,”m“持续数月,”w“持续数周,”d“持续数天,例如”+ 1m + 7d“),或空以清除所选日期。