Question

作为初学者，我经常难以理解Python-Django，html，javascript和css之间的联系。

手头的问题是：我正在尝试从django-bootstrap3-datetimepicker-2实现DateTimePicker小部件。

由于这个库不包含js / css资产，我开始实现没有后端参与的datetimepicker只是为了看看我是否正确加载了所有静态文件等。因此，我将this example添加到html模板：

<div class="container">
    <div class="row">
        <div class="col-sm-6">
            <div class="form-group">
                <div class="input-group date" id="datetimepicker1">
                    <input type="text" class="form-control">
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function () {
                $('#datetimepicker1').datetimepicker();
            });
        </script>
    </div>
</div>

一切都按预期工作，所以我尝试将dodango形式的datetimepicker实现为一个小部件：

class FooForm(forms.Form):
    pick_a_date = forms.DateTimeField(
        widget=DateTimePicker(options={
            "format": "YYYY-MM-DD",
            "pickTime": False}
        ))

我也想从表单向导（即formtools.wizard中的SessionWizardView）中受益，所以我将上面提到的表单输出到html中：

  <form action="" method="post" role="form">{% csrf_token %}
  <table>
    {{ wizard.management_form }}
    {% if wizard.form.forms %}
      {{ wizard.form.management_form }}
      {% for form in wizard.form.forms %}
          {{ form }}
      {% endfor %}
    {% else %}
      {{ wizard.form }}
    {% endif %}
  </table>

但是，窗口小部件没有响应（日历窗口未显示，glyphicon-calendar图标不执行任何操作）。当我离开测试日期时间选择器（最近工作的）时，都会中断。

开发人员的控制台打印以下内容：

Uncaught TypeError: option pickTime is not recognized!
    at Boolean.<anonymous> (bootstrap-datetimepicker.js:1440)
    at Function.each (jquery-2.1.1.min.js:2)
    at Object.picker.options (bootstrap-datetimepicker.js:1436)
    at dateTimePicker (bootstrap-datetimepicker.js:2276)
    at HTMLDivElement.<anonymous> (bootstrap-datetimepicker.js:2309)
    at Function.each (jquery-2.1.1.min.js:2)
    at n.fn.init.each (jquery-2.1.1.min.js:2)
    at n.fn.init.$.fn.datetimepicker (bootstrap-datetimepicker.js:2304)
    at HTMLDocument.<anonymous> ((index):154)
    at j (jquery-2.1.1.min.js:2)

我很困惑，我甚至不知道在哪里看。你知道任何可以向我解释的文章或文件吗？请指教。

我经历了一些githubs项目，他们似乎没有比我更多的东西（特别是我担心它是模板标签，但大多数只有{％load bootstrap3％}，有些有{％load静态％}，我也有）。我也试过这个suggestion。

Answer 1

将Django表单的格式更改为dd/MM/YYYY。另外，从表单中删除pickTime。我相信这些在早期版本中有所改变;也许你使用的例子已经过时了。

没有响应的django-bootstrap3-datetimepicker（没有显示日历）

1 个答案: