0

我需要使用多选，所以我知道使用 select2 标签。但是我遇到了一个问题..我已经从 nette 渲染了带有值的多选..当我查看 html 代码时，我可以看到所有选项及其值..但是当我为该选择启用 select2 时，它显示“未找到结果”但仍然在代码中有数据..我也想使用标签，这也不起作用..有什么可能的解决方案吗？谢谢

我正在像这样启用 select2 - select 具有“多区域”类： 

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

PS：我在 bootstrap 和 select2 包含之前包含了 jquery。

编辑：发布 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 的“数据”属性中添加数据作为数组，但效果仍然相同 - 未找到结果

4

2 回答 2

0

休息几天后我解决了它..问题出在外部.js文件中-我的同事定义了.select2样式，其中select2使用默认..所以当我想在脚本中声明select2时，他的样式重写了它然后它没有` t数据..谢谢你所做的一切。氰酸

于 2018-09-03T07:08:07.343 回答
0

您需要添加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参数，以防止它在每次选择时关闭，这对于多项选择很有用。

于 2018-08-30T08:29:28.983 回答