django动态过滤形式

时间:2011-12-20 17:02:20

标签: javascript python django forms menu

我正在将一个项目从php转换为Django并遇到过滤菜单的问题。我有一个表格:

class SearchForm(forms.Form):
    genus = forms.CharField(max_length=100)
    #    species
    species = forms.CharField(max_length=100)
    #   island group
    island_group = forms.ModelChoiceField(queryset=Localitymayor.objects.values_list('islandgroup', flat=True).distinct('islandgroup').exclude(islandgroup="n/a").order_by('islandgroup'), empty_label=_("Not Specified"))
    #   island name
    island_name = forms.ModelChoiceField(queryset=Localitymayor.objects.values_list('islandname', flat=True).distinct('islandname').exclude(islandname="n/a").order_by('islandname'), empty_label=_("Not Specified"))

我的模板是:

<form action="{% url cdrs_search %}" method="post">{% csrf_token %}
{% for field in form %}
<div class="fieldWrapper">
    {{ field.errors }}
    {{ field.label_tag }}: {{ field }}
</div>
{% endfor %}
</form>

现在我想根据island_name的选择过滤island_group的输出。在我的php项目中,我使用ajax onChange调用另一个php脚本来管理它。但是,我有点迷失在Django中如何做到这一点。由于这是我第一次在Django中使用ajax,我将不胜感激任何关于处理这个简单但常见的过滤菜单问题的最佳实践方法的建议。提前谢谢。

3 个答案:

答案 0 :(得分:1)

您需要查看ajax脚本以查询基于组的名称列表,例如

# views.py
def ajax_endpoint(request):
    # leaving error checking to you
    group = request.GET.get('group')
    names_list = avalable_names(group) # some function or db call
    return HttpResponse(json.dumps(names_list))

答案 1 :(得分:1)

一种选择是在javascript中执行此操作。您可以使用jQuery的ajax请求调用单独的视图。此单独视图的作用是根据用户选择的island_group处理模型数据(岛)名称的服务器端排序。然后,您可以使用javascript使用视图中的响应重新填充表单。关于如何执行此操作的一些很好的示例可以找到in this blog(它有点密集,但非常有用),in an article on how to do this with javascriptin this tutorial(强烈推荐)。

还有一篇好的帖子解释了为什么有必要这样做,包括它可能有点迂腐,但它有助于在创建过滤表单时为我澄清一些事情。请查看该问题的 accepted answer

答案 2 :(得分:0)

这里是betspire.com的票证形式的代码修改。这段代码片段依赖于加载jQuery。

这是您需要的JavaScript:

    function update_select(select, data) {
        select.find('option').remove();
        select.append($('<option value="">-------</option>'));
        for (var i in data) {
            select.append($('<option value="'+data[i][0]+'">'+data[i][1]+'</option>'));
        }
    }

    $('select[name=island_group]').live('change', function(e) {
        $.get(
            '{% url island_name_choices_for_island_group %}',
            {
                'island_group': $(this).val(),
            },
            function(data, textStatus, jqXHR) {
                update_select($('select[name=island_name]'), data);
            },
            'json'
        );
    });

添加到网址:

url(
    r'island_name/choices/$',
    'island_name_choices_for_island_group', {
    }, 'island_name_choices_for_island_group',
),

添加到观看次数:

from django.utils import simplejson

from models import *

def island_name_choices_for_island_group(request, qs=None):
    if qs is None:
        # Change the default QS to your needs
        # (you didn't specify it)
        qs = Island.objects.all()

    if request.GET.get('island_group'):
        # assuming your Island model has an FK named island_group to model IslandGroup
        qs = qs.filter(island_group__pk=request.GET.get('island_group'))

    results = []
    for choice in qs:
        results.append((choice.pk, choice.name))

    return http.HttpResponse(simplejson.dumps(results))

如果你遇到麻烦,请告诉我。