时间戳

首页 > 解决方案 > Django/Ajax：如何异步过滤表单字段的查询集？

javascript - Django/Ajax：如何异步过滤表单字段的查询集？

问题描述

在给定的 Django 表单视图中，我想通过用户在查看表单时选择的选项过滤字段的查询集。我希望这种情况异步发生。我读过 AJAX 可能是我应该使用的，但我对 JS 知之甚少，我无法理解我读过的信息。

在我看来，我希望用户能够单击一个或多个复选框，这些复选框将通过“item.in_itemlist”或“item.item_type”过滤“loot.item_name”（自动使用onChange或onUpdate或……？）。有人会给我一些指示吗？干杯，

这是我的模型：

模型.py

class Itemlist(models.Model):
    name = models.CharField([...])

class Item(models.Model):
    name = models.CharField([...])
    item_type = models.CharField([...])
    in_itemlist = models.ForeignKey(Itemlist, [...])

class Loot(models.Model):
    item_name = models.ForeignKey(Item, [...])
    quantity = [...]

我的观点，

视图.py

def create_loot(request):
    # LootForm is a simple ModelForm, with some crispy layout stuff.
    form = LootForm(request.POST or None)
    if request.method == 'POST':
        if form.is_valid():
            form.save()
            [...]
    return render(request, 'loot_form.html', context={'form': form}

和模板，

loot_form.html

{% extends "base_generic.html" %}

{% block leftsidebar %}
   /* for each unique itemlist referenced in the items, */
   /* make a checkbox that once clicked, filters 'loot.item_name' by the selected option.*/
{% endblock leftsidebar %}

{% block content %}

  <h1 class="page-title">Add Loot</h1>
  <hr class="page-title-hr">

  {% csrf_token %}
  {% load crispy_forms_tags %}
  {% crispy form form.helper %}

{% endblock content %}

标签： javascriptdjangoajaxasynchronousdjango-forms

解决方案

您可以为模型创建基于 Api 的视图

在 JavaScript 中，您可以调用 API 端并获取数据 Ajax 代码可以如下所示

$(document).ready(function () {
    setTimeout(function () {
      $(document).on('click', '#id', function () {
        $.get("./api/v2/end_point?state=" + state, function (data, status) {
          var inner_data = data[0].state_count;
          change_text.html(inner_data);
        });
      });
    }, 100);
})

推荐阅读