在引导选择组件中的搜索不起作用，其中数据令牌包含所有数字;4730”;

Search in the bootstrap-select component is not working where data-token contains all numbers like "4730"

本文关键字：包含所 令牌 数据 数字 4730 选择 组件 不起作用 搜索      更新时间：2023-09-26

我正在使用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/.您可以单击添加新仓库按钮进行检查。您必须遵循选择层次结构才能获得邮政编码选择选项。最初的国家，比分区、区。。。。。。邮政编码。

可能是与我使用的插件有关的问题我的问题是，我如何从外部克服这一障碍Ar首先我的想法是，检查"4730"是否可以降低成本，从而可以搜索。但它失败了。我的JS代码填充邮政编码选择是这样的-

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

它看起来像是引导程序选择中的一个错误。如果您分配的数据标记是一个数字值，则select不是类型检查并将其转换为字符串。如果向数据标记添加另一个字符串值，则整个属性将自动转换为字符串。如果你只想为你的邮政编码添加数字，你可以在datatokens属性中为你的代码添加一个尾随空格，它会为你自动转换它（只要这不会打乱你的任何逻辑）。

尾部空格示例：

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

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

替换这行代码

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

通过这条线路

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

这将把数值转换为字符串。

相关文章：