从数据库中选择 2 个多 select select 项目 Laravel 8

Question

我有个小问题。我的编辑表单中有一个 Select2 多选字段。现在我的目标是我的脚本加载所有选项并预选正确的选项。

我已经尝试了整个过程，但到目前为止还没有达到预期的结果

这是我的代码

多选控制器代码段。

// Convert multiselect in right form
$product = $product['tags'];
$new = serialize($user);
$product['tags'] = $new;

edit.blade.php（片段）

<div class="form-group">
    <label for="tag">Product Tags</label>
    <select id="tag" class="select2 select2-hidden-accessible {{ $errors->has('tags') ? 'error' : '' }}" multiple="multiple" name="tags[]" style="width: 100%;" data-select2-id="5" tabindex="-1" aria-hidden="true" value="1">
        @foreach($tags as $tag)
                <option value="{{ $tag->id }}" {{ in_array($tag->id, $prisoner->tag) ? 'selected="selected"' : '' }}>{{ $tag->label }} - {{ $tag->name }}</option>
            @endif
        @endforeach
    </select>
</div>

小js代码：

$('#tag').select2({ placeholder: "Please select" }).trigger('change');

希望有人能帮助我。

Answer 1

解决方案示例：带有 id 标签s

var values = $('#tags option[selected="true"]').map(function() { return $(this).val(); }).get();

// you have no need of .trigger("change") if you dont want to trigger an event
$('#tags').select2({ placeholder: "Please select" });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
  <body>
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>

<select id="tags" select2 select2-hidden-accessible multiple="multiple" style="width: 300px">
    <option value="1" selected="true">Apple1</option>
    <option value="2">Bat</option>
    <option value="Cat">Cat</option>
    <option value="Dog" selected>Dog1</option>
    <option value="Elephant">Elephant</option>
    <option value="View/Exposure" >View/Exposure</option>
    <option value="View / Exposure">View / Exposure</option>
    <option value="Dummy - Data" selected>Dummy - Data</option>
    <option value="Dummy-Data">Dummy-Data</option>
    <option value="Dummy:Data">Dummy:Data</option>
    <option value="Dummy(Data)">Dummy(Data)</option>    
</select>

  </body>
</html>

从数据库中选择 2 个多 select select 项目 Laravel 8

Select2 multiselect select items from db with Laravel 8

php

jquery

node.js

laravel

jquery-select2