在django模板中访问小部件值

时间:2017-05-28 10:18:18

标签: django django-forms django-templates

我需要在django中进行ajax调用,具体取决于在两个日期字段和选择下拉列表中设置的值。为了做到这一点,我必须将这些值传递给javascript函数,当单击一个按钮时将调用它。我已将表单日期字段设置为日期类型,并选择为选择字段。如何将这些值的当前值传递给javascript函数?

form.html(模板):

<div class="form-group">
    <label class="control-label">* Start Date:</label><br>
    {{ form.date1 }}
</div>
<div class="form-group">
    <label class="control-label">* End Date:</label><br>
    {{ form.date2 }}
</div><br><br>
<div class="form-group">
    Category: {{ form.category }}
</div>
<button type="button" class="btn btn-xs btn-warning"
onclick="javascript:check_availability({{ XXX }}, '{% url "find_available" %}');">
    Check Now
 </button>

使用Javascript:

function check_availability(date1, date2, category, url) {
    $.ajax({
        type: 'GET',
        url: url,
        data: {date1: date1, date2: date2, category: category},
        dataType: 'json',
        success: available_now,
        error: function() {
            alert('Unable to find available items')
        }
    });
}

fucntion available_now () {...}

在form.py(查看)

category = forms.ChoiceField(choices=(...))
date1 = forms.DateField(widget=forms.DateInput())
date2 = forms.DateField(widget=forms.DateInput())

如何为上述函数调用传递小部件中设置的三个值代替XXX?我需要专门获取下拉列表的选定值。

1 个答案:

答案 0 :(得分:0)

这绝不是关于Django的问题,而是关于Javascript的问题。由于您使用jQuery作为Ajax函数,因此您应该使用它来获取字段的值。另请注意,您应该避免直接在HTML中设置onclick处理程序;你也应该在你的jQuery脚本中这样做。

<button type="button" id='find-available' class="btn btn-xs btn-warning" data-url='{% url "find_available" %}');">
    Check Now
 </button>

...

$('form').on('click', '#find-available', function() {
   $this = $(this);
   $.ajax({
        type: 'GET',
        url: $this.data('url'),
        data: $this.parent().serialize(),
        dataType: 'json',
        success: available_now,
        error: function() {
            alert('Unable to find available items')
        }
    });
});