使用带有流星的日期选择器

Question

我已经尝试了一天让日期选择器在我的流星应用程序中工作。这里有一些关于此的问题，但似乎都没有提供完整的答案。我终于按照这个安装了一个而不会导致错误-

好的，我使用 http://www.eyecon.ro/bootstrap-datepicker/ 中的 bootstrap-datepicker.js 和 datepicker.css 手动完成了这项工作，并将这些文件放入客户端文件夹中。使用该页面中提到的标记以及以下模板助手：

Template.templatename.rendered = function() {
$('#datepicker').datepicker();
}

无论我在模板中输入什么信息，我都无法使其正常工作，因此我尝试了模板助手的这个答案-

    Template.datepicker.events ({           
         'focus #datepicker': function () {
              $('#datepicker').datepicker({
                format: 'M dd, yyyy',
                autoclose: true
               })
            console.log('#datepicker has focus');
         }
    });

仍然只有一个空白输入字段。这是我当前的 html 模板-

<template name="datepicker">
        <div class="input-append date" id="dp3" data-date="12-02-2012" data-date-format="dd-mm-yyyy">
        <input id="datepicker" class="span2" size="16" type="text" value="12-02-2012">
        <span class="add-on"><i class="icon-th"></i></span>
</div>

</template>

我怀疑我唯一的问题是了解 datepicker 返回模板的内容。

Answer 1

问题似乎是您从未告诉日期选择器“显示”。您将初始化代码放在应该告诉它显示的“焦点”事件中。例如，尝试：

Template.datepicker.rendered = function() {
  // initialize datepicker
  $('#datepicker').datepicker({
    format: 'm, dd, yyyy'
  });
};

Template.datepicker.events ({           
  'focus #datepicker': function () {
    // show datepicker
    $('#datepicker').datepicker('show');  
    console.log('#datepicker has focus');
  }
});

或者，这个datetimepicker package 很适合我。