在前端页面使用modelform生成几个搜索框，然后设置一个按键 通过点击按键提交后 将前端中搜索框中的内容通过POST传入到后端 后端根据前端传入的内容进行数据搜索 并将搜索的内容传入前端进行展示

好的，这里是一个使用 Django `ModelForm` 生成多个搜索框，并通过 AJAX 提交表单数据进行搜索的示例代码。这个示例代码需要使用 jQuery 库，所以请确保在页面中引入了 jQuery 库。

假设我们有一个模型叫做 `Product`，其中有一个字段叫做 `name`，我们希望在前端生成两个搜索框，用于搜索产品名称中包含特定关键词的产品。下面是使用 `ModelForm` 生成搜索框的示例代码：

# forms.py

from django import forms
from .models import Product

class ProductSearchForm(forms.Form):
    name = forms.CharField(label='名称', max_length=100, required=False)
    description = forms.CharField(label='描述', max_length=100, required=False)

在上面的代码中，我们使用了 `forms.Form` 来生成一个表单，其中包含两个字段：`name` 和 `description`。这两个字段都是可选的，因为我们希望允许用户只填写一个或者不填写。

接下来，在视图函数中，我们可以这样使用 `ProductSearchForm`：

# views.py

from django.shortcuts import render
from django.http import JsonResponse
from .forms import ProductSearchForm
from .models import Product

def product_search(request):
    form = ProductSearchForm(request.POST or None)
    if request.method == 'POST' and form.is_valid():
        name = form.cleaned_data['name']
        description = form.cleaned_data['description']
        queryset = Product.objects.all()
        if name:
            queryset = queryset.filter(name__icontains=name)
        if description:
            queryset = queryset.filter(description__icontains=description)
        data = [{'name': product.name, 'description': product.description} for product in queryset]
        return JsonResponse({'data': data})
    return render(request, 'product_search.html', {'form': form})

在上面的代码中，我们首先创建一个 `ProductSearchForm` 的实例，并且检查请求方法是否为 `POST`。如果是，就使用表单对象来接收前端提交的数据，并且检查表单数据是否合法。如果表单数据合法，我们就可以根据前端传入的搜索条件来搜索数据了。这里我们使用了 `JsonResponse` 来返回搜索结果，其中 `data` 字段包含了搜索到的产品的名称和描述。

最后，我们在模板文件 `product_search.html` 中，使用下面的代码来渲染表单和搜索结果：

<!-- product_search.html -->

<form id="product-search-form">
  {% csrf_token %}
  {{ form.as_p }}
  <button type="submit">搜索</button>
</form>

<div id="product-search-results"></div>

<script>
$(function() {
  $('#product-search-form').on('submit', function(event) {
    event.preventDefault();
    var formData = $(this).serialize();
    $.ajax({
      url: '{% url 'product_search' %}',
      type: 'POST',
      data: formData,
      dataType: 'json',
      success: function(response) {
        var results = '';
        $.each(response.data, function(index, product) {
          results += '<div><p>' + product.name + '</p><p>' + product.description + '</p></div>';
        });
        $('#product-search-results').html(results);
      }
    });
  });
});
</script>

在上面的代码中，我们首先为表单添加了一个 ID，然后使用 jQuery 来监听表单的提交事件。当用户点击提交按钮时，我们使用 `$(this).serialize()` 来序列化表单数据，并通过 AJAX 发送到后端。后端搜索数据后，返回一个 JSON 格式的响应。在前端，我们使用 `$.each()` 来遍历搜索结果，并将其渲染成 HTML，最后显示在页面中。

希望这个示例能够帮助到您。