【问题标题】:October CMS create a multi select Form field十月 CMS 创建多选表单字段
【发布时间】:2016-06-07 19:17:20
【问题描述】:

我需要在十月 Cms 后端表单 (fields.yaml) 中创建一个多选表单字段。我应用了以下方法

选择字段:
标签:样品
类型:下拉
属性:{multiple:'multiple'}

该字段的选项将从模型中调用

一切正常,但是当我提交表单时,只有第一个选择的选项作为 JSON 数据插入到数据库表文本字段中。我希望存储每个选定的选项。我还在模型中将该字段声明为 Jsonable,即 protected $jsonable = ['field_name'];

注意:当我将类型用作 checkboxlist 时,它按我的想法工作,但我不希望它是 checkboxlist。我是十月 cms 的新手,有什么简单的方法..

【问题讨论】:

    标签: php html octobercms


    【解决方案1】:

    您不能使用具有多个值的下拉字段,因为它是用来处理单个值的。作为复选框和收音机,这就是为什么会有 checkboxList(我猜)。

    但我找到了解决方案。 在 fields.yaml 中使用部分作为字段类型而不是下拉列表

    https://octobercms.com/docs/backend/forms#field-partial

    使用以下内容创建一个部分(注意名称属性中的 [] 这就是它起作用的原因!)

    但请注意,这只是一个技巧,您只能使用直接的 yaml 选项分配 https://octobercms.com/docs/backend/forms#field-dropdown

    <?php
        $fieldOptions = $field->options();
        //get the field value as an array
        $selectedValues = (array)$field->value;
    
    ?>
    <!-- Dropdown -->
    <?php if ($this->previewMode): ?>
        <div class="form-control"><?= (isset($fieldOptions[$field->value])) ? e(trans($fieldOptions[$field->value])) : '' ?></div>
    <?php else: ?>
    
        <select
            id="<?= $field->getId() ?>"
            name="<?= $field->getName() ?>[]"
            class="form-control custom-select"
            <?= $field->getAttributes() ?>>
            <?php if ($field->placeholder): ?>
                <option value=""><?= e(trans($field->placeholder)) ?></option>
            <?php endif ?>
            <?php foreach ($fieldOptions as $value => $option): ?>
                <?php
                    if (!is_array($option)) $option = [$option];
                ?>
                <option
    
                    <?= in_array($value, $selectedValues)  ? 'selected="selected"' : '' ?>
                    <?php if (isset($option[1])): ?>data-<?=strpos($option[1],'.')?'image':'icon'?>="<?= $option[1] ?>"<?php endif ?>
                    value="<?= $value ?>">
                        <?= e(trans($option[0])) ?>
                </option>
            <?php endforeach ?>
        </select>
    <?php endif?>
    

    对于 yaml

    ```
    select_field:
        label: Sample
        type: partial
        path:$/author/plugin/models/classfolder/_my_partial.htm
        attributes: {multiple:'multiple'}
        options:
            key:value
            key:value
    ```
    

    更好的方法可能是构建一个小部件或提出拉取请求 如果你有能力,你可以触摸核心并添加

    \modules\backend\widgets\form\partials 中的相同内容 名称为 _field_dropdownlist.htm

    然后在 \modules\backend\widgets\form\Form.php 第 630 行 改变:

    $optionModelTypes = ['dropdown', 'radio', 'checkboxlist', 'balloon-selector'];
    

    添加不带 _field 或 .htm 的部分名称,例如 _field_dropdownlist.htm 变为 dropdowList

    $optionModelTypes = ['dropdown', 'radio', 'checkboxlist', 'balloon-selector','dropdowlist'];
    

    现在在您的 yaml 文件中,只需使用 type:dropdownList 即可。

    【讨论】:

    • 我做了和你一样的事情。我创建了一个部分并将多选选项的名称属性设置为一个数组,一切正常但是阻止我发布该答案的是如何在部分的选择字段中显示选定的选项。我想尝试您的第二种方法,即构建一个小部件。我希望它能起作用,谢谢 Greg Bee
    • 嗨,您能告诉我如何使用空值更新多选字段。如果用户不想选择任何东西。我尝试了很多,但我无法找到更好的解决方案
    • 我认为最好的方法是在控制器中覆盖 formBeforeUpdate($model) 函数并检查您的字段是否已发送,然后您可以处理这种情况。
    • 您好,感谢您对 Greg 的关注。由于我是 10 月 CMS 的新手,我无法轻松地在控制器中计算和实现 formBeforeUpdate($model) 函数,在您的空闲时间,我请求您分享一些示例或前景的代码。
    【解决方案2】:

    【讨论】:

      【解决方案3】:

      您可以使用“taglist”小部件来执行此操作;-)

      【讨论】:

      • 仅供参考,taglist 已添加到 octobercms 中,仅在最新版本中,而非 beta 中。
      • @VijayWilson,是的,如果你没有它,那么你可以用“repeater + checkbox”或“belongsToMany 关系”替换select ui,它可以具有相同的功能但另一个视图
      • 是的,你是对的,但实际上需要放置一个多选下拉菜单。
      • 我没有得到标签列表。它与所有其他小部件位于 backend/formwidgets/ 中,但您无法通过 builder > models 选择它?
      • 抱歉,0o 找不到了
      【解决方案4】:

      你可以使用 select2 jquery 插件

      _widget.htm

      <!-- for booking table -->
      <select  class="form-control" id="sle1" name="Booking[business_car_id]" >
      
          <?php   foreach($businesscars as $key => $value): ?>
              <option class="form-control" value="<?php echo $key; ?>" >
                   <?php
                  echo $value; ?>  
              </option>
      
          <?php endforeach; ?>
      </select>
      

      并将select2.js和select2.css分别放在assets/js和assets/css forlder中

      从这里下载选择 2 https://select2.org/getting-started/basic-usage

      【讨论】:

        【解决方案5】:

        要通过表单处理多对多关系,您可以使用多选输入或复选框。 在十月cms,有relational form widgettaglist form widget这对夫妇来处理这种情况。
        在 fields.yaml 中定义以下内容:

        # relational form widget
        categories: # relationship name  defined in the model
          label: 'Associated categories'
          span: full
          required: 1
          type: relation
          nameFrom: title # db column name to fetch to show the display value
        
        #taglist form widget
          categories:
            label: 'Associated categories'
            span: full
            mode: relation
            required: 1
            type: taglist
            nameFrom: title
        

        【讨论】:

          猜你喜欢
          • 2016-08-03
          • 2017-03-22
          • 1970-01-01
          • 2020-01-21
          • 2017-07-27
          • 1970-01-01
          • 1970-01-01
          • 2018-02-28
          • 1970-01-01
          相关资源
          最近更新 更多