Question

我需要使用multiselect，所以我有了主意，使用select2标签。但是我有一个问题..我用值渲染了nette的多选..当我查看html代码时，我可以看到所有带有其值的选项..但是当我为select2启用select2时，它说'没有找到结果'但仍然在代码中有数据..我也想使用标签，而且这也不起作用..任何可能的解决方案吗？谢谢

我这样启用select2-select具有类“ multiple-regions”：

<script>
        $(document).ready(function () {
            $('.multiple-regions').select2({
                tags: true
            });
        });
</script>

PS：我在引导程序之前包含了jquery，而select2包含了。

编辑：发布HTML（我现在使用的是来自nette的表单组件，但是使用原始HTML时是相同的

{form filterRoutesForm}
  <div class="row" style="padding: 0 1em;">
    <div class="col-md-5">
      <div class="form-group">
        {label date class=>"form-control-label"/}
        {input date class=>"form-control daterange-routes"}
      </div>
    </div>

    <div class="col-md-5">
      <div class="form-group">
        {label region class=>"form-control-label"/}
        {input region class=>"form-control multiple-regions"}
      </div>
    </div>

    <div class="col-md-2">
      {input search class=>"btn btn-primary form-control", style=>"margin-top: 35px;"}
    </div>
  </div>
{/form}

以下是原始HTML的相同示例：

<select name="region[]" multiple="multiple" class="form-control multiple-regions">
  <option value="all">všechny kraje</option>
  <option value="1">Praha</option>
  <option value="2">Střední Čechy</option>
  <option value="3">Jih a západ Čech</option>
  <option value="4">Severní Čechy</option>
  <option value="5">Východní Čechy</option>
  <option value="6">Jižní Morava</option>
  <option value="7">Severní Morava</option>
  <option value="8">Bratislava</option>
  <option value="9">Západní Slovensko</option>
  <option value="0">Východní Slovensko</option>
</select>

顺便说一句，我也尝试在select2的'data'属性中将数据添加为数组，但效果仍然相同-未找到结果

Answer 1

您需要添加select2.css，select2.js以及jquery（如果尚未添加），请添加multiple，这几乎就是您所需要的。

$(document).ready(function () {
   $('.multiple-regions').select2({
      tags: true,
      width: '100%'
   });
});

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script language="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.js"></script>
<link rel="stylesheet" media="screen" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.css" />

<select name="region[]" class="form-control multiple-regions" multiple>
  <option value="all">všechny kraje</option>
  <option value="1">Praha</option>
  <option value="2">Střední Čechy</option>
  <option value="3">Jih a západ Čech</option>
  <option value="4">Severní Čechy</option>
  <option value="5">Východní Čechy</option>
  <option value="6">Jižní Morava</option>
  <option value="7">Severní Morava</option>
  <option value="8">Bratislava</option>
  <option value="9">Západní Slovensko</option>
  <option value="0">Východní Slovensko</option>
</select>

如果需要，您最终可以添加closeOnSelect: false作为select2参数，以防止它在每次选择时都关闭，这对于多个选择很有用。

Answer 2

休息了几天后，我解决了..问题出在外部.js文件中-我的同事在其中定义了.select2样式，其中select2使用默认值..因此，当我想在脚本中声明select2时，他的样式将其重写，然后它没有数据。谢谢您的一切。 Cya

select2不显示数据

2 个答案: