“未为 Select2未定义错误定义查询函数”

尝试使用 Select2并在多个项目输入/文本字段中得到此错误:

"query function not defined for Select2 undefined error"
114894 次浏览

在这个谷歌组的线程覆盖

问题在于 select2添加了额外的 div。Select2添加了带有类“ Select2-Container form-select”的新 div 来包装创建的 select。所以下一次我加载这个函数时,当 select2附加到 div 元素时抛出错误。我改了选择器。

前缀 select2 css 标识符,具有特定的标记名称“ select”:

$('select.form-select').select2();

这个问题归结为我是如何构建我的 select2选择框的。

$(function(){
$(".select2").select2();
});

在另一个 js 文件中覆盖..。

$(function(){
var employerStateSelector =
$("#registration_employer_state").select2("destroy");
employerStateSelector.select2({
placeholder: 'Select a State...'
});
});

Moving the second override into a window load event resolved the issue.

$( window ).load(function() {
var employerStateSelector =
$("#registration_employer_state").select2("destroy");
employerStateSelector.select2({
placeholder: 'Select a State...'
});
});

这个问题出现在 Rails 应用程序中

对我来说,这个问题归结为设置正确的 data-ui-select2属性:

<input type="text" data-ui-select2="select2Options.projectManagers" placeholder="Project Manager" ng-model="selectedProjectManager">




$scope.projectManagers = {
data: []  //Must have data property
}


$scope.selectedProjectManager = {};

如果取消 $scope.projectManagers上的 data属性,就会得到这个错误。

您的选择器似乎返回一个未定义的元素(因此返回 undefined error)

如果元素确实存在,则对 input元素调用 select2,而不向 select2提供任何内容,它应该从那里获取数据。通常,我们调用 .select2({data: [{id:"firstid", text:"firsttext"}])

在使用 ajax 时也得到了相同的错误。

如果您使用 ajax 来呈现带有 select2的表单,input _ html 类必须不同于那些不使用 ajax 呈现的类。不知道为什么会这样。

当我在文本框中使用 ajax 时,我也得到了同样的错误,然后我通过文本框的 删除类 select2解决它,并通过 id 设置 select2,比如:

$(function(){
$("#input-select2").select2();
});

如果你初始化一个空输入,这样做:

$(".yourelement").select2({
data: {
id: "",
text: ""
}
});

阅读下面的第一条评论,它解释了为什么和什么时候你应该在我的回答中使用代码。

此错误消息过于笼统。它的另一个可能的来源是,您试图在已经“ select2ed”的输入上调用 select2()方法。

我还遇到了这个问题,请确保不要将 select2初始化两次。

我得到了同样的错误。我一直在使用 select2-3.5

这是我的代码有错误

    $('#carstatus-select').select2().val([1,2])

下面的代码修复了这个问题。

    $('#carstatus-select').val([1,2]);

我有一个复杂的 Web 应用程序,我不能确切地找出为什么会抛出这个错误。它导致 JavaScript 在抛出时中止。

在 select2.js 中,我改变了:

        if (typeof(opts.query) !== "function") {
throw "query function not defined for Select2 " + opts.element.attr("id");
}

致:

        if (typeof(opts.query) !== "function") {
console.error("query function not defined for Select2 " + opts.element.attr("id"));
}

现在一切似乎都正常工作,但它仍然在错误日志中,以防我想尝试找出究竟是什么在我的代码中导致了错误。但现在这对我来说已经足够了。

if (typeof(opts.query) !== "function") {
throw "query function not defined for Select2 " + opts.element.attr("id");
}

This is thrown becase query does not exist in options. Internally there is a check maintained which requires either of the following for parameters

  • Ajax
  • 标签
  • 资料
  • 疑问

因此,您只需要向 select2提供这4个选项中的一个,它就会按预期工作。

用途:

try {
$("#input-select2").select2();
}
catch(err) {


}