如何创建年份选择器下拉菜单

Posted 2023-02-16

【中文标题】如何创建年份选择器下拉菜单

【英文标题】：How to create year picker dropdown

【发布时间】：2020-09-24 12:01:53

【问题描述】：

我想知道如何在 Magnolia 中创建年份选择器下拉字段。

理想情况下，它会列出从当前年份到过去 10 年的年份。

我是 magnolia 的新手，我可以使用硬编码选项创建 Select 字段，但这不是很好的方法，我很难创建动态选项。见：

name: year
fieldType: select
multiselect: false
label: Year
options:
  - name: 2020
    label: 2020
    selected: true
    value: 2020
  - name: 2019
    label: 2019
    selected: false
    value: 2019

有人知道吗？

【参考方案1】：

如果您使用最新版本的 Magnolia 6.2，您可以使用 Ducaz035 提到的数据源。请参阅此处的文档：https://documentation.magnolia-cms.com/display/DOCS62/Select+field

对于以前的版本，这种方式是不可能的。您只能创建自己的字段，注册它并在实现中做任何您想做的事情。在您的情况下，只需覆盖 getOptions 类。

public class YearSelectFieldFactory<D extends YearSelectFieldDefinition> extends SelectFieldFactory<D> 
    
    public YearSelectFieldFactory(D definition, Item relatedFieldItem, UiContext uiContext, I18NAuthoringSupport i18nAuthoringSupport) 
        super(definition, relatedFieldItem, uiContext, i18nAuthoringSupport);
    

    public YearSelectFieldFactory(D definition, Item relatedFieldItem) 
        super(definition, relatedFieldItem);
    

    @Override
    public List<SelectFieldOptionDefinition> getOptions() 
        List<SelectFieldOptionDefinition> res = new ArrayList<>();
        int currentYear = LocalDate.now().getYear();
        for (int i = currentYear - 10; i <= currentYear; i++) 
            SelectFieldOptionDefinition option = new SelectFieldOptionDefinition();
            option.setName(String.format("Year%s", i));
            option.setLabel(String.format("Year %s", i));
            option.setValue(String.valueOf(i));
            res.add(option);
        
        res.get(0).setSelected(true);
        return res;
    

YearSelectFieldDefinition 只是扩展了 SelectFieldDefinition 类。我们需要它来注册我们自己的字段类型。

要注册字段，请将新的 fieldType 添加到您的模块（或其他模块，没关系）。这是该字段的 YAML 定义：

your-module-name:
  fieldTypes:
    yearSelectField: 
      definitionClass: com.example.fields.YearSelectFieldDefinition
      factoryClass: com.example.fields.YearSelectFieldFactory

现在您可以在对话框定义中使用此字段。设置字段的类：

field:
  name: year
  class: com.example.fields.YearSelectFieldDefinition

【参考方案2】：

您可以将数据源附加到该字段，并让数据源为您提供使用 Java 的月份。

文档中的一个示例：

listSelect:
  label: Contacts
  $type: listSelectField
  datasource:
    $type: jcrDatasource
    workspace: contacts
    describeByProperty: firstName
    allowedNodeTypes:
      - mgnl:contact

以及直接指向文档的链接： https://documentation.magnolia-cms.com/display/DOCS62/Select+field