Silverstripe中如何实现嵌套DataObject的可多选结构化展示？

需求背景 #

我需要从XML数据源导入如下嵌套结构：

• CompanyType
  • CompanySubType

示例：

• Engineering
  • structural-engineering
  • architectural-engineering

我已经创建了对应的两个DataObject，代码如下：

ExpertiseTag（对应CompanyType） #

class ExpertiseTag extends DataObject { 
    private static $db = [ 
        'SortID' => 'Int', 
        'Title' => 'Varchar' 
    ]; 
    private static $has_one = [ 
        'MemberPage' => 'MemberPage' 
    ]; 
    private static $has_many = [ 
        'ExpertiseSubTags' => 'ExpertiseSubTag' 
    ]; 
    public function getCMSFields() { 
        $fields = parent::getCMSFields(); 
        $fields->removeByName('SortID'); 
        $fields->removeByName('MemberPageID'); 
        $fields->addFieldToTab('Root.Main', TextField::create( 
            'Title', 'Tag naam' 
        ) ); 
        return $fields; 
    } 
}

ExpertiseSubTag（对应CompanySubType） #

class ExpertiseSubTag extends DataObject { 
    private static $db = [ 
        'SortID' => 'Int', 
        'Title' => 'Varchar' 
    ]; 
    private static $has_one = [ 
        'ExpertiseTag' => 'ExpertiseTag' 
    ]; 
    public function getCMSFields() { 
        $fields = parent::getCMSFields(); 
        $fields->removeByName('SortID'); 
        $fields->addFieldToTab('Root.Main', TextField::create( 
            'Title', 'Tag naam' 
        ) ); 
        return $fields; 
    } 
}

现在我想在Holder页面实现可查看嵌套结构且支持多选的效果，但当前用的ListboxField只展示了ExpertiseTag，没有包含子对象，现有代码如下：

$fields->addFieldToTab('Root.Expertise', ListboxField::create( 
    'ExpertiseTags', 'Expertise (tags):', 
    ExpertiseTag::get()->map('ID', 'Title')->toArray(), 
    $this->ExpertiseTags()->column('ID'), 
    null, true 
));

请问应该如何调整或重构代码来实现这个需求？或许ListboxField并不是合适的选择？

解决方案 #

嘿，你说得对，ListboxField确实不适合展示嵌套层级的选项，它是为平面列表设计的。下面给你几个适配这个需求的方案，按推荐程度排序：

方案1：使用NestedCheckboxSetField（最推荐） #

SilverStripe提供的NestedCheckboxSetField就是专门用来处理这种父子层级的多选场景的，它会自动渲染带缩进的嵌套复选框，用户可以清晰区分父标签和子标签，操作也直观。

首先确保你的Holder页面已经和ExpertiseTag建立了多对多关系（从你用$this->ExpertiseTags()来看，应该已经在Holder的$many_many里定义了'ExpertiseTags' => 'ExpertiseTag'），然后替换原来的ListboxField代码：

use SilverStripe\Forms\NestedCheckboxSetField;

// 构建嵌套选项数组
$nestedOptions = [];
foreach (ExpertiseTag::get()->sort('Title') as $tag) {
    $subTags = [];
    // 遍历当前父标签的所有子标签
    foreach ($tag->ExpertiseSubTags()->sort('Title') as $subTag) {
        $subTags[$subTag->ID] = $subTag->Title;
    }
    // 把父标签和子标签组织成嵌套结构
    $nestedOptions[$tag->ID] = [
        'title' => $tag->Title,
        'children' => $subTags
    ];
}

// 添加嵌套复选框字段
$fields->addFieldToTab('Root.Expertise', NestedCheckboxSetField::create(
    'ExpertiseTags',
    'Expertise (tags):',
    $nestedOptions
)->setMultiple(true));

这个方案的优势是完全匹配你的嵌套展示+多选需求，用户体验好，代码逻辑也清晰。

方案2：自定义分组的ListboxField（如果偏好Listbox样式） #

如果你一定要保留ListboxField的样式，可以手动给选项分组，用HTML的optgroup把子标签归到父标签下面，再用空格模拟缩进：

$groupedOptions = [];
foreach (ExpertiseTag::get()->sort('Title') as $tag) {
    $subOptions = [];
    foreach ($tag->ExpertiseSubTags()->sort('Title') as $subTag) {
        // 用两个空格模拟子标签的缩进
        $subOptions[$subTag->ID] = '  ' . $subTag->Title;
    }
    // 先添加父标签，再把子标签加入同一个分组
    $groupedOptions[$tag->Title][$tag->ID] = $tag->Title;
    if (!empty($subOptions)) {
        $groupedOptions[$tag->Title] += $subOptions;
    }
}

// 更新ListboxField的选项为分组后的数组
$fields->addFieldToTab('Root.Expertise', ListboxField::create(
    'ExpertiseTags',
    'Expertise (tags):',
    $groupedOptions,
    $this->ExpertiseTags()->column('ID'),
    null,
    true
));

不过这个方案只是视觉上的分组，父标签和子标签是独立的选项，没有真正的层级关联，适合对样式有特定要求但不需要强层级交互的场景。

方案3：使用GridField配合关联编辑器（适合复杂管理） #

如果你的需求不仅是多选，还需要在Holder页面直接管理标签（比如添加、编辑子标签），可以用GridField搭配关联编辑器组件，实现更完整的层级管理：

use SilverStripe\Forms\GridField\GridField;
use SilverStripe\Forms\GridField\GridFieldConfig_RelationEditor;
use SilverStripe\Forms\GridField\GridFieldInlineEditing;

// 创建GridField配置，启用关联编辑和内联编辑
$config = GridFieldConfig_RelationEditor::create();
$config->addComponent(new GridFieldInlineEditing());

// 自定义显示列，把子标签列出来
$config->getComponentByType('SilverStripe\Forms\GridField\GridFieldDataColumns')->setDisplayFields([
    'Title' => 'Main Tag',
    'ExpertiseSubTags.Title' => 'Sub Tags'
]);

// 添加GridField到页面
$fields->addFieldToTab('Root.Expertise', GridField::create(
    'ExpertiseTags',
    'Expertise (tags)',
    $this->ExpertiseTags(),
    $config
));

这个方案适合需要在关联页面直接维护标签层级的场景，但多选操作不如复选框直接，更偏向于管理而非快速选择。

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