如何正確設置按鈕附帶的日期選擇器

Question

我目前正在使用Grappelli進行Django項目，並且正在嘗試創建一個模仿標准更改表單的頁面。 該頁面不是基於任何模型的，因此我只是自己在所有字段中添加。 但是，我在使用日期選擇器時遇到了麻煩。 每當我單擊應該顯示日歷的按鈕時，都不會發生任何事情。 我敢肯定，我根本沒有包括一些重要的內容。

這是我當前的代碼：

{% extends "admin/change_form.html" %}

{% block javascripts %}
{{ block.super }}
{% endblock %}

{% block content %}

    <div id="grp-content-container">
        <form enctype="multipart/form-data" action method="post">
            {% csrf_token %}
            <div>
                <fieldset class="module grp-module">
                    <div class="form-row grp-row grp-cells-1 dob">
                        <div class="field-box l-2c-fluid l-d-4">
                            <div class="c-1">
                                <label class="required" for="dob">Birthday</label>
                            </div>
                            <div class="c-2">
                                <p class="datetime">
                                    <input class="vDateField hasDatepicker" type="text" id="dob" name="dob">
                                    <button id="dob-button" type="button" class="ui-datepicker-trigger"></button>
                                </p>
                            </div>
                        </div>
                    </div>
               </fieldset>
            </div>
        </form>
    </div>
{% endblock %}

在javascripts塊中，我試圖添加從該網站http://jqueryui.com/datepicker/取得的datepicker源功能，但這似乎沒有任何效果。 有什么建議么？

Answer 1

我已經做過幾次了，想告訴我使用grappelli幾乎可以立即使用。

興趣點：

grappelli.js具有以下grappelli.js行：

var dateFields = $("input[class*='vDateField']:not([id*='__prefix__'])");
dateFields.datepicker(options);

而grappelli.reinitDateTimeFields函數將其重新初始化。

因此，基本上您要做的就是將vDateField或/和vTimeField類放入輸入字段，並確保正確加載了grappelli.js ，並在文檔准備就緒時調用了grappelli.initDateAndTimePicker() 。 然后帶有日期選擇器的按鈕應自動加載。

你可以肯定的是grappelli.initDateAndTimePicker()被調用任何其他JS文件：只要把debugger; initDateAndTimePicker中initDateAndTimePicker構造函數中的某個位置，然后它必須在您的js檢查器中暫停。

希望能對您有所幫助。