如何实现custom_checklist_from_array？类似于清单，但数据是在 CrudController 中输入的

Question

我想在 laravel 背包中使用 Checklist Field，但它说我们必须与另一个 table 建立关系。但是我想把选项放在我的 CrudController 中，比如 select_from_array。

我不知道如何自定义这个字段。

我想使用清单而不是 select_from_array

Answer 1

在 resources/views/vendor/backpack/crud/fields/checklist_direct.blade.php 创建一个包含以下内容的文件（checklist_direct 可以是您选择的任何名称）：

<!-- checklist with directly provided options -->
<!-- checklist_filtered -->
@php
    $options = isset($field['options']) ? $field['options'] : [];
@endphp

<div @include('crud::inc.field_wrapper_attributes') >
    <label>{!! $field['label'] !!}</label>
    @include('crud::inc.field_translatable_icon')
    <?php $entity_model = $crud->getModel(); ?>

    <div class="row">
        @foreach ($options as $option)
            <div class="col-sm-4">
                <div class="checkbox">
                    <label>
                        <input type="checkbox"
                               name="{{ $field['name'] }}[]"
                               value="{{ $option }}"
                               @if( ( old( $field["name"] ) && in_array($option , old( $field["name"])) ) )
                                  checked = "checked"
                               @endif > {!! $option !!}
                    </label>
                </div>
            </div>
        @endforeach
    </div>

    {{-- HINT --}}
    @if (isset($field['hint']))
        <p class="help-block">{!! $field['hint'] !!}</p>
    @endif
</div>

然后在控制器中更新对 addField 的调用，如下所示：

   $this->crud->addField([
        'label'     => 'Printers',
        'type'      => 'checklist_direct',
        'name'      => 'printer',
        'attribute' => 'printer_name',
        'options'   => ['HP', 'Cannon', 'Dell'],
    ]);

注意：您还可以考虑在 table 上使用枚举列并使用 enum.blade.php 字段模板，或者可能制作一个使用复选框而不是 select 的自定义枚举字段盒子.

Answer 2

我需要对代码进行一些更新。我在 resources/views/vendor/backpack/crud/fields/checklist_array.blade.php 创建了一个包含以下内容的文件（checklist_array 可以是您选择的任何名称）：

我更新了下面的代码，我所做的更新之一是，在编辑时它没有带来选定的值。现在您正在 javascript

中引入脚本

<!-- checklist with directly provided options -->
<!-- checklist_filtered -->
@php
$options = isset($field['options']) ? $field['options'] : [];

// calculate the value of the hidden input
$field['value'] = old(square_brackets_to_dots($field['name'])) ?? ($field['value'] ?? ($field['default'] ?? []));

if (is_string($field['value'])) {
    $field['value'] = json_decode($field['value']);
} 

// define the init-function on the wrapper
$field['wrapper']['data-init-function'] = $field['wrapper']['data-init-function'] ?? 'bpFieldInitChecklist';
@endphp

@include('crud::fields.inc.wrapper_start')
<label>{!! $field['label'] !!}</label>
@include('crud::fields.inc.translatable_icon')

<input type="hidden" value='@json($field['value'])' name="{{ $field['name'] }}">

<div class="row">
    @foreach ($options as $option)
    <div class="col-sm-4">
        <div class="checkbox">
            <label>
                <input type="checkbox" name="{{ $field['name'] }}[]" value="{{ $option }}" @if( ( old( $field["name"] )
                    && in_array($option , old( $field["name"])) ) ) checked="checked" @endif> {!! $option !!}
            </label>
        </div>
    </div>
    @endforeach
</div>

{{-- HINT --}}
@if (isset($field['hint']))
<p class="help-block">{!! $field['hint'] !!}</p>
@endif
@include('crud::fields.inc.wrapper_end')

{{-- ########################################## --}}
{{-- Extra CSS and JS for this particular field --}}
{{-- If a field type is shown multiple times on a form, the CSS and JS will only be loaded once --}}
@if ($crud->fieldTypeNotLoaded($field))
@php
$crud->markFieldTypeAsLoaded($field);
@endphp
{{-- FIELD JS - will be loaded in the after_scripts section --}}
@push('crud_fields_scripts')
<script>
    function bpFieldInitChecklist(element) {
                //console.log(element);
                var hidden_input = element.find('input[type=hidden]');
                var selected_options = JSON.parse(hidden_input.val() || '[]');
                var checkboxes = element.find('input[type=checkbox]');
                var container = element.find('.row');

                // set the default checked/unchecked states on checklist options
                checkboxes.each(function(key, option) {
                    var id = $(this).val();
                    if (selected_options.map(String).includes(id)) {
                        $(this).prop('checked', 'checked');
                    } else {
                        $(this).prop('checked', false);
                    }
                });

                // when a checkbox is clicked
                // set the correct value on the hidden input
                checkboxes.click(function() {
                    var newValue = [];

                    checkboxes.each(function() {
                        if ($(this).is(':checked')) {
                            var id = $(this).val();
                            newValue.push(id);
                        }
                    });

                    hidden_input.val(JSON.stringify(newValue));

                });
            }

</script>
@endpush

@endif
{{-- End of Extra CSS and JS --}}
{{-- ########################################## --}}

   //form
   $this->crud->addField([
        'label'     => 'Printers',
        'type'      => 'checklist_direct',
        'name'      => 'printer',
        'attribute' => 'printer_name',
        'options'   => ['HP', 'Cannon', 'Dell'],
    ]);
 
//model
protected $casts = [
        ...
        'printer' => 'array',
    ];

如何实现custom_checklist_from_array？类似于清单，但数据是在 CrudController 中输入的

How to implement custom_checklist_from_array? Like checklist but the data is inputted in CrudController

laravel-backpack