在数据令牌包含所有数字（如“4730”）的情况下，在 bootstrap-select 组件中搜索不起作用

Question

我正在使用https://silviomoreto.github.io/bootstrap-select/为表单选择生成搜索选项。 搜索选项适用于任何字符串，接受包含数字的字符串，例如"4730" 。

我正在从 JSON 的 select 标记中填充数据。 这是我的选择标签 -

<div class="col-sm-10">
  <select class="form-control selectpicker show-tick" title="Select post-code..." id="post-code" data-live-search-placeholder="Search desired post-codes here" data-live-search="true">
  </select>
</div>

我从哪里获取邮政编码的 JSON -

  {
    "Country": [
    {
      "id": "01",
      "name": "China",
      "capital": "Beijing",
      "divisions": ["01", "02", "03"],
      "districts": ["01", "02", "03"]
    },
    ........
   ],
  "Divisions": [
    {
      "id": "01",
      "name": "Shengdong",
      "districts": ["01","20"]
    },
    ........
   ],
   "Subdistricts": [
    {
      "id": "01",
      "name": "Dailang",
      "postcodes": ["736200","404000","100000"]
    },
    ........
   ]
 }

每个搜索框都将选项视为字符串，并根据数据标记进行搜索。

对于实时测试 - http://ni8mr.github.io/gpsl-ui/ 。 您可以通过单击添加新仓库按钮来检查它。 您必须遵循选择层次结构才能获得邮政编码选择选项。 起初国家，比师、区……邮政编码。

可能是我使用的插件的问题。 我的问题是，我怎样才能从外部克服这个障碍？ 首先我的想法是，检查“4730”是否可以小写，从而可以搜索。 但它失败了。 我用于填充邮政编码选择的 JS 代码是这样的 -

$("#post-code").empty().append('<option data-tokens="' + related_postcodes +'" value="' + some_number + '">' + related_postcodes + '</option>').change(function(){
            ....some codes .....

      }).selectpicker('refresh');

Answer 1

它看起来像是 bootstrap-select 中的一个错误。 如果您分配一个数字值的数据标记，则选择不会进行类型检查并将其转换为字符串。 如果您向数据令牌添加另一个字符串值，则整个属性会自动转换为字符串。 如果您只想为您的邮政编码添加数字，您可以在 data-tokens 属性中为您的代码添加一个尾随空格，它会自动为您投射它（只要这不会弄乱您的任何逻辑） .

带有尾随空格的示例：

$("#post-code").empty().append('<option data-tokens="' + related_postcodes +' " value="' + some_number + '">' + related_postcodes + '</option>').change(function(){
            ....some codes .....

      }).selectpicker('refresh');

Answer 2

这是 bootstrap select 中的错误，因此在bootrap-select.js中添加这个小修复

替换这行代码

// var haystack = ($obj.data('tokens') || $obj.text()).toUpperCase();

通过这条线

var haystack = ($obj.data('tokens') || $obj.text()).toString().toUpperCase();

这会将您的数值转换为 String 。