Django ModelForm多对多(m2m)字段可搜索筛选Widget替代方案咨询

以下是两种目前稳定可用的实现方式： #

方案1：复用Django Admin原生筛选组件（无额外依赖） #

Django Admin内置的*FilteredSelectMultiple*组件完全可以直接用到自定义表单中，效果和Admin后台的多对多筛选框完全一致，支持关键词搜索、批量选择，无需额外安装第三方包。

实现步骤： #

1. 修改ModelForm配置，指定pools字段使用该组件：

from django.contrib.admin.widgets import FilteredSelectMultiple
from django.forms import ModelForm
from .models import Sample

class FormulariMostra(ModelForm):
    class Meta:
        model = Sample
        fields = ("name", "sample_id_sex", "pools",)
        widgets = {
            # 第一个参数为选项组名称，is_stacked=False表示左右分栏布局
            "pools": FilteredSelectMultiple("关联Pool", is_stacked=False)
        }

2. 在渲染表单的模板中引入组件依赖的静态资源：
   首先在模板顶部加载静态文件标签：

{% load static %}

在<head>标签中引入样式：

<link rel="stylesheet" href="{% static 'admin/css/widgets.css' %}">

在页面底部引入脚本：

<script src="{% static 'admin/js/core.js' %}"></script>
<script src="{% static 'admin/js/SelectBox.js' %}"></script>
<script src="{% static 'admin/js/SelectFilter2.js' %}"></script>

3. 确保项目urls.py中已经配置了Admin路由：

from django.contrib import admin
urlpatterns = [
    path('admin/', admin.site.urls),
    # 你的其他路由
]

方案2：使用django-select2组件（适合超大数据量场景） #

如果Pool的总数据量超过1万条，推荐用目前仍在活跃维护的django-select2组件，支持异步搜索加载，无需一次性把所有选项渲染到前端，性能更好。

实现步骤： #

1. 安装依赖：

pip install django-select2

2. 在settings.py的INSTALLED_APPS中注册组件：

INSTALLED_APPS = [
    # 你的其他应用
    'django_select2',
]

3. 在urls.py中添加组件路由：

urlpatterns = [
    # 你的其他路由
    path('select2/', include('django_select2.urls')),
]

4. 修改ModelForm配置：

from django.forms import ModelForm
from django_select2.forms import Select2MultipleWidget
from .models import Sample

class FormulariMostra(ModelForm):
    class Meta:
        model = Sample
        fields = ("name", "sample_id_sex", "pools",)
        widgets = {
            "pools": Select2MultipleWidget(
                search_fields=["name__icontains"], # 按Pool的name字段模糊搜索
                attrs={"data-placeholder": "搜索Pool名称...", "style": "width: 100%"}
            )
        }

5. 在渲染表单的模板底部添加以下代码，自动加载组件需要的静态资源：

{{ form.media }}

内容的提问来源于stack exchange，提问作者Swimming bird