选择2: 去除输入文本中的空格，如果为空- 防止发送Ajax请求

Question

我正在使用带有Ajax的Select2来加载远程数据（建议）。

一切都运作良好，但是有一个问题：当用户只输入空格时（通过按空格键）- Ajax请求将被发送。

我该如何防止这种情况发生？此外，我希望在发送之前修剪术语。

$(".js-data-example-ajax").select2({
  placeholder: "Select... ",
  minimumInputLength: 3,
  ajax: {
    url: "/my-site/tags",
    dataType: 'json',
    data: function (params) {
        return {
            q: params.term
        };
    },
    processResults: function (data) {
        return {
            results: data
        };
    },
    cache: true
}

编辑：

我忘记提到我已经尝试过类似以下的操作：

        data: function (params) {
            if (params.term.trim().length  < 2) {
                return;
            }
            return {
                q: $.trim(params.term)
            };
        },

并且 GET（Ajax）请求仍然被发送。

- PeraMika

Answer 1

您可以使用 data 函数来检查搜索 term（去除空格后）的长度，并在长度小于 3 时返回：

data: function (params) {
  if (params.term.trim().length  < 3) {
    throw false;
  }
  return {
    q: params.term.trim()
  };
},

我试图从data函数内部获取minimumInputLength的值，但无法获取，因此您应该将此数字写两次。

更新

我唯一能停止请求的方法是在data函数内部throw异常。我知道这可能不是一个好选择，但它有效。

我还发现了一个关于这个问题的开放票据：https://github.com/select2/select2/issues/1637因此我想还没有这样的选项。

- Dekel

---

是的，谢谢。不幸的是，这只是 Select2 的又一个缺陷。但在将您的答案标记为正确之前 - 我会等一下，以防其他人有关于此的话要说。 - PeraMika

当然没问题。我真的希望有更好的解决方案（因为在我看来，throw 不是一个好的解决方案）。 - Dekel

Answer 2

你可以重写 transport 选项，在验证失败时返回 null，否则返回 原始函数代码

对我来说有效。

{
    data: function (params) {
        return {
            q: params.term
        };
    },
    transport: function (params, success, failure) {
        if(params.data.q.trim().length < 3) {
            return null;
        }
        //the original function code:
        var $request = $.ajax(params);

        $request.then(success);
        $request.fail(failure);

        return $request;
    },
}

- Micky

---

对我有用的唯一方法。 - Lazy Babe

Answer 3

你需要通过自己的函数覆盖传输方法，并对参数进行任何操作，然后决定使用XHR、$.ajax或axios处理请求。

- zizanovic

---

因为即使我们从数据函数返回 null 或 false，它也不会停止请求。 - zizanovic