在选择中键入 3 个字符后开始搜索.js单个项目选择

Question

在"选择单个项目选择"中，在选择框中键入第一个字符后开始搜索。

我需要在搜索

框中输入三个字符后才开始搜索。

任何人都可以建议如何做到这一点吗？

Answer 1

在"选择演示示例"中，您可以找到以下行：

if (!query.length) return callback();

您可以将其更改为：

if (query.length < 3) return callback();

例如，在我的情况下，我从Ajax中调用一些"汽车/车辆"列表：

jQuery('#select-car').selectize({
    valueField: 'id',
    labelField: 'title',
    searchField: 'title',
    options: [],
    load: function(query, callback) {
    if (query.length < 3) return callback(); //if (!query.length)
    $.ajax({
        url: 'search/',
        type: 'GET',
        dataType: 'json',
        data: {
            car: query,
        },
        error: function() {
            callback();
        },
        success: function(res) {
            callback(res);
        }
    });
  }
});

问候。

Answer 2

document.getElementById('text').onkeyup = function(){
     if(document.getElementById("input-tags").value.length > 3)
     {
         $('#input-tags').selectize({
           // ....Enter Your Code....
         });
     }
}

Answer 3

仅使用查询长度if (query.length < 3) return callback();的问题在于，当您从输入中删除所有字符并重新键入时，它不起作用，因为选项已经填充。尝试以下操作，您将很高兴。

  $(document).ready(function(){
     $('#formid').keyup(function(){
        var len = $(this).find('div.selectize-input.items input').val().length;
        if(len < 3){
            $('.selectize-dropdown.js_client_search').css('display','none');
        }else{
            $('.selectize-dropdown.js_client_search').css('display','');
        }
    });
});

然后调用您的选择。

$('.js_client_search').selectize({
        load: function(query, callback) {
            if (query.length < 3){
                return callback();
            }else{
                $.ajax({
                    url: 'search/',
                    type: 'GET',
                    dataType: 'json',
                    data: {
                        car: query,
                    },
                    error: function() {
                        callback();
                    }, 
                    success: function(res) {
                        callback(res);
                    }
                 });
            }