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

Question

尝试使用 Select2 并在多个项目输入/文本字段上收到此错误：

"query function not defined for Select2 undefined error"

Answer 1

涵盖在这个谷歌群组主题中

问题是因为 select2 添加了额外的 div。 Select2 添加了类为“select2-container form-select”的新 div 来包装创建的选择。因此，下次我加载该函数时，会抛出错误，因为 select2 已附加到 div 元素。我改变了我的选择器...

在 select2 css 标识符前加上特定标签名称“select”：

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

Answer 2

这个错误信息太笼统了。它的其他可能来源之一是您尝试在已经“select2ed”的输入上调用

select2()

方法。

Answer 3

如果您初始化空输入，请执行以下操作：

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

阅读下面的第一条评论，它解释了为什么以及何时应该使用我的答案中的代码。

Answer 4

我也遇到了这个问题，请确保您没有初始化 select2 两次。

Answer 5

对我来说，这个问题归结为设置正确的 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 = {};

如果我取消

data

上的

$scope.projectManagers

属性，我会收到此错误。

Answer 6

这个问题归结为我如何构建 select2 选择框。在一个 javascript 文件中我有...

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

并在另一个js文件中进行覆盖...

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

将第二个覆盖移至窗口加载事件中解决了该问题。

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

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

Answer 7

在将ajax与文本框一起使用时，我也遇到了同样的错误，然后我通过删除文本框的类select2并按id设置select2来解决它，例如：

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

Answer 8

您的选择器似乎返回了一个未定义的元素（因此返回了

undefined error

）

如果该元素确实存在，您将在

input

元素上调用 select2，而不向 select2 提供任何内容，它应该从中获取数据。通常，人们会打电话给

.select2({data: [{id:"firstid", text:"firsttext"}])

。

Answer 9

使用ajax时也遇到同样的错误。

如果您使用ajax通过select2渲染表单，则input_html类必须与那些不使用ajax渲染的类不同。但不太清楚为什么会这样。

Answer 10

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

这是因为选项中不存在查询而抛出的。内部维护了一项检查，需要以下任一参数

• ajax
• 标签
• 数据
• 查询

因此，您只需为 select2 提供这 4 个选项之一，它就应该按预期工作。

Answer 11

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

这是我的代码，有错误

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

下面的代码解决了问题。

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

Answer 12

我有一个复杂的 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"));
        }

现在一切似乎都正常工作，但它仍然登录错误，以防我想尝试找出代码中到底是什么导致了错误。但目前这对我来说已经足够好了。

Answer 13

如果您之前看到过这个问题，就像这样“jquery.min.js:917 Uncaught ReferenceError: select2_dc80d1e9 is not Defined。 最后我检查了所有的东西和所有的结果。所以我意识到 也许“/vendor/kartik-v/yii2-krajee-base/src/WidgetTrait.php”中有问题。正如你在最后一个插件 js 中看到的那样。 $pos 返回 1。所以我覆盖“$view->registerJs($js, $pos, $key);”到“$view->registerJs($js, View::POS_LOAD, $key);”或“$view->registerJs($js, View::POS_END, $key);”问题解决了。希望你喜欢。