如何在Wagtail面板中实现多页面选择而非单页选择？

嘿，我来帮你搞定这个需求！要在Wagtail面板里实现多选页面，只需要把原来的单页面关联字段换成多对多关联，再配置对应的多选面板就行，具体步骤如下：

1. 修改模型字段 #

原来的link_page用的是ForeignKey，只能关联单个页面，我们把它换成多对多类型的字段：

基础多选版（无需排序） #

from django.db import models
from wagtail.core.models import Page

class Collections(models.Model):
    heading = models.TextField(blank=True,)
    description = models.RichTextField(blank=True,)
    SelectResources = models.SortedManyToManyField(SelectResource)
    # 替换ForeignKey为ManyToManyField，支持关联多个页面
    link_pages = models.ManyToManyField(
        'wagtailcore.Page',
        blank=True,
        related_name='+'
    )

支持排序的多选版 #

如果需要像你现有的SelectResources那样，能对选中的页面拖拽排序，就用Wagtail的SortedManyToManyField：

from django.db import models
from wagtail.core.models import Page
from wagtail.snippets.models import SortedManyToManyField

class Collections(models.Model):
    heading = models.TextField(blank=True,)
    description = models.RichTextField(blank=True,)
    SelectResources = models.SortedManyToManyField(SelectResource)
    # 支持排序的多页面关联字段
    link_pages = SortedManyToManyField(
        'wagtailcore.Page',
        blank=True,
        related_name='+'
    )

2. 配置Wagtail编辑面板 #

接下来在panels配置里，把原来的单页面选择器换成支持多选的版本，给PageChooserPanel加上multiple=True参数：

from wagtail.admin.panels import FieldPanel, PageChooserPanel, InlinePanel

class Collections(models.Model):
    # ... 上面的字段定义 ...

    panels = [
        FieldPanel('heading', classname="title"),
        FieldPanel('description', classname="full"),
        InlinePanel('SelectResources', label="Select Resources"),
        # 启用多选模式的页面选择器
        PageChooserPanel('link_pages', multiple=True),
    ]

几个关键细节说明 #

• ManyToManyField：Django原生的多对多关联，完美适配“选多个页面”的需求
• SortedManyToManyField：Wagtail专门做的扩展，在多对多基础上支持拖拽排序选中的页面，和你现有的SelectResources逻辑一致
• PageChooserPanel(multiple=True)：Wagtail 2.11及以上版本支持这个参数，开启后面板会弹出支持多选的页面选择弹窗，选完的页面会以列表形式展示在面板里，还能随时添加/删除
• related_name='+'：这个参数是为了避免创建反向关联，防止和其他模型的关联逻辑冲突

这样改完之后，你在Wagtail的后台编辑页面时，就能轻松选择多个页面啦！

内容的提问来源于stack exchange，提问作者priyanka priya