Question

我有一个选择2多选选项

var rate: Float

我想设置一些默认值，以防用户正在编辑表单。我已经成功地做到了这一点

textcontent = textcontent.decode('utf8').encode('big5')

但问题是我允许用户使用select {2}的<select multiple name="event_type[]" class="form-control" id="selectEvents"> @foreach ($eTypes as $type) <option>{{$type}}</option> @endforeach </select>选项生成选项。

当我设置最初在html选项中的默认值时，它可以工作，但是当我设置用户生成的默认值时，它不起作用。

这是我第一次使用select2。

我怎样才能实现这个目标？

Answer 1

进行一些挖掘，我可以在GitHub上看到此问题。

一种选择是检查值是否存在，如果不存在则检查append。

var s2 = $("#selectEvents").select2({
    placeholder: "Choose event type",
    tags: true
});

var vals = ["Trade Fair", "CA", "Party"];

vals.forEach(function(e){
if(!s2.find('option:contains(' + e + ')').length) 
  s2.append($('<option>').text(e));
});

s2.val(vals).trigger("change");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.css" rel="stylesheet"/>

<select multiple name="event_type[]" class="form-control" id="selectEvents">
  <option>Trade Fair</option>
  <option>Party</option>
  <option>Foo</option>
  <option>Bar</option>
</select>

Answer 2

我最近不得不在PHP脚本中实现带有选项'multiple'和'tags'的select2，并遇到了类似的问题。文档说要添加任何初始选择作为html选项标签，但是当我尝试添加两个时，只有一个会显示在我的select2控件中。

我最终使用配置对象'data'选项初始化select2控件，我将动态创建它。

var initialPropertyOptions = [];
@foreach ($model->properties as $initialProperty`)
    var initialPropertyOption = {
        id:         {{ $initialProperty->id }},
        text:       '{{ $initialProperty->name }}',
        selected:   true
    }
    initialPropertyOptions.push(initialPropertyOption);
@endforeach

$('#properties').select2({
    ajax: {
        url:        route('models.propertySearch'),
        dataType:   'json',
        delay:      250,
        processResults: function(data) {
            return {
                results: data
            }
        }
    },
    placeholder:        'Enter property name',
    minimumInputLength: 1,
    multiple:           true,
    tags:               true,
    data:               initialPropertyOptions
});

<div>
    <label for="properties">Properties</label>
    <select name="properties[]" id="properties">
    </select>
</div>

Answer 3

另一种简单的方法是将值设置为select选项，然后再次将其设为select2：

$('#properties').val(["Trade Fair", "CA", "Party"]);
$('#properties').select2({});

对我有用

选择2多个选择和允许标签的默认值

3 个答案: