无法通过在django admin中替换django的默认日期时间小部件来使Custom小部件工作

时间:2013-07-12 08:10:36

标签: python django django-admin django-widget

我问了一个问题here,但我认为它已经死了。我甚至用我的进步更新了它。所以在那之后我使用firebug为firefox工作了一些,发现了一些对我来说毫无意义的错误。但在此之前我的代码是:(我的应用名称是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 datetime picker替换django的默认日期时间小部件 现在,输入字段中的iddate_time_tz tz_widget.js中包含的相同ID 我把它作为一个独立的文件运行,我将tz_widget.js包含在我的html文件的src中。有用。但在django它没有。

错误:

TypeError:$未定义 tz_widget.js(第1行) 这是:$(window).load(function(){

TypeError:$未定义 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())

1 个答案:

答案 0 :(得分:1)

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

TypeError: $ is undefined ...

看起来好像你可能忘了那样做。

TimeZoneDate窗口小部件声称窗口小部件名为

id=\"date_time_tz\"

js正在尝试使用名为

的内容
$('#date-time-tz')

我建议改变其中一个,以便它们匹配!也许在小部件中;

id=\"date-time-tz\"