python - 无法通过在 django admin 中替换 django 的默认日期时间小部件来使自定义小部件正常工作

Question

我问了一个问题here但我认为它已经死了。我什至更新了我的进度。因此，在那之后，我更多地使用了 firefox 的 firebug，发现了一些对我来说毫无意义的错误。但在此之前，这是我的代码:(我的应用程序名称是 ui)

ui/admin.py

class MyModelAdmin(admin.ModelAdmin):
    class Media:
        css = {
                "all": ("style/jquery-ui.css",
                        "style/jquery-ui-timepicker-addon.css",)
            }
        js = ("js/jquery-ui.js",
              "js/jquery-ui-timepicker-addon.js",
              "js/tz_widget.js",)

    formfield_overrides = {
            models.DateTimeField : {'widget': TimezoneDate()},
        }

widgets.py

DATE_FORMAT = "%m-%d-%y"

class TimezoneDate(forms.widgets.Widget):

    def __init__(self, attrs=None):
        super(TimezoneDate, self).__init__(attrs)

    def render(self, name, value, attrs=None):

        if value is None:
            vstr = ''
        elif hasattr(value, 'strftime'):
            vstr = datetime_safe.new_datetime(value).stftime(DATE_FORMAT)
        else:
            vstr = value
        id = "%s" % name
        args = \
            "<input type=\"text\" value=\"%s\" name=\"%s\" id=\"date_time_tz\" />" % \
            (vstr, name)

        return mark_safe(u"\n".join(args))

这是 tz_widget.js :

$(window).load(function(){
    $(function() {
        $('#date-time-tz').datetimepicker({
        dateFormat: $.datepicker.RFC_2822,
        timeFormat: 'hh:mm:ss z',
        showTimezone: true,
        timezoneList: [
            {"value": "0", "label": "UTC"},
            {"value": "+60", "label": "FRANCE"},
            {"value": "+330", "label": "INDIA"},
            {"value": "-240", "label": "US EAST"},
            {"value": "-420", "label": "US SF"}
        ]
    });       
});
});

所以我想用jQuery UI日期时间选择器替换django的默认日期时间小部件 现在，输入字段中的 id 是 date_time_tz ，与 tz_widget.js 中包含的 id 相同 我将它作为一个独立文件运行，其中我将 tz_widget.js 包含在 html 文件的 src 中。有用。但在 django 中则不然。

错误:

类型错误:$ 未定义 tz_widget.js(第 1 行) 即:$(window).load(function(){

类型错误:$ 未定义 js/jquery-ui-timepicker-addon.js(第 20 行) 这是: $.ui.timepicker = $.ui.timepicker || {};

我认为这两个地方都产生同样的错误。我有点摸不着头脑了。这是 link到 jQuery-UI-datetimepicker。请一些指导？

**更新:**

我将此部分添加到 widget.py 中，但 HTML 源代码中仍然没有小部件。

class TimezoneDateForm(forms,Form):
    test = forms.DateTimeField(label="", widget=TimezoneDate())

Answer 1

对于 jQuery 小部件，您需要在 html header 中包含 jQuery.js(或您拥有的任何名称)核心库文件。

TypeError: $ is undefined ...

看起来好像您可能忘记了这样做。

TimeZoneDate 小部件声称该小部件被调用

id=\"date_time_tz\"

但是js正在尝试使用名为

的东西

$('#date-time-tz')

我建议更改其中之一，以便它们匹配!也许在小部件中；

id=\"date-time-tz\"