Mencoba menggunakan Select2 dan mendapatkan kesalahan ini pada beberapa bidang input / teks item:
"query function not defined for Select2 undefined error"
Mencoba menggunakan Select2 dan mendapatkan kesalahan ini pada beberapa bidang input / teks item:
"query function not defined for Select2 undefined error"
Jawaban:
Tercakup dalam utas grup google ini
Masalahnya adalah karena div ekstra yang ditambahkan oleh select2. Select2 telah menambahkan div baru dengan kelas "select2-container form-select" untuk membungkus pilihan yang dibuat. Jadi pada saat saya memuat fungsi, kesalahan itu dilemparkan saat select2 dilampirkan ke elemen div. Saya mengubah pemilih saya ...
Awali pengenal css select2 dengan nama tag tertentu "pilih":
$('select.form-select').select2();
$(document).ready(function() { $('select.form-select').select2()})
.select2({})
metode. Solusi yang lebih baik adalah memanggil metode penghancuran terlebih dahulu. Contoh:$("#mySelectControl").select2("destroy").select2({});
Jika Anda menginisialisasi input kosong, lakukan ini:
$(".yourelement").select2({
data: {
id: "",
text: ""
}
});
Baca komentar pertama di bawah ini, ini menjelaskan mengapa dan kapan Anda harus menggunakan kode dalam jawaban saya.
select2()
tidak hanya menerima parameter kosong
Saya juga punya masalah ini memastikan bahwa Anda tidak menginisialisasi select2 dua kali.
Bagi saya, masalah ini bermuara pada pengaturan atribut data-ui-select2 yang benar:
<input type="text" data-ui-select2="select2Options.projectManagers" placeholder="Project Manager" ng-model="selectedProjectManager">
$scope.projectManagers = {
data: [] //Must have data property
}
$scope.selectedProjectManager = {};
Jika saya melepas data
properti pada $scope.projectManagers
saya mendapatkan kesalahan ini.
Masalah ini bermuara pada bagaimana saya membangun kotak pilih pilih2 saya. Dalam satu file javascript saya punya ...
$(function(){
$(".select2").select2();
});
Dan di file js lain sebuah override ...
$(function(){
var employerStateSelector =
$("#registration_employer_state").select2("destroy");
employerStateSelector.select2({
placeholder: 'Select a State...'
});
});
Memindahkan penggantian kedua ke acara pemuatan jendela menyelesaikan masalah.
$( window ).load(function() {
var employerStateSelector =
$("#registration_employer_state").select2("destroy");
employerStateSelector.select2({
placeholder: 'Select a State...'
});
});
Masalah ini berkembang di dalam aplikasi Rails
Saya juga mendapat kesalahan yang sama saat menggunakan ajax dengan textbox lalu saya mengatasinya dengan menghapus class select2 dari textbox dan mengatur select2 oleh id seperti:
$(function(){
$("#input-select2").select2();
});
Tampaknya pemilih Anda mengembalikan elemen yang tidak ditentukan (Oleh karena undefined error
itu dikembalikan)
Jika elemen benar-benar ada, Anda memanggil select2 pada input
elemen tanpa menyediakan apa pun ke select2, tempat asal pengambilan datanya. Biasanya, satu panggilan .select2({data: [{id:"firstid", text:"firsttext"}])
.
Juga mendapat kesalahan yang sama saat menggunakan ajax.
Jika Anda menggunakan ajax untuk merender formulir dengan select2, kelas input_html harus berbeda dari yang TIDAK dirender menggunakan ajax. Tidak begitu yakin mengapa ini bekerja seperti ini.
if (typeof(opts.query) !== "function") {
throw "query function not defined for Select2 " + opts.element.attr("id");
}
Ini dilemparkan karena kueri tidak ada dalam opsi. Secara internal ada pemeriksaan yang dipertahankan yang membutuhkan salah satu dari berikut ini untuk parameter
Jadi, Anda hanya perlu menyediakan salah satu dari 4 opsi ini untuk memilih2 dan itu akan berfungsi seperti yang diharapkan.
Saya mendapat kesalahan yang sama. Saya telah menggunakan select2-3.5.2
Ini adalah kode saya yang mengalami kesalahan
$('#carstatus-select').select2().val([1,2])
Kode di bawah memperbaiki masalah.
$('#carstatus-select').val([1,2]);
Saya memiliki Aplikasi Web yang rumit dan saya tidak tahu persis mengapa kesalahan ini terjadi. Itu menyebabkan JavaScript dibatalkan saat dibuang.
Di select2.js saya mengubah:
if (typeof(opts.query) !== "function") {
throw "query function not defined for Select2 " + opts.element.attr("id");
}
untuk:
if (typeof(opts.query) !== "function") {
console.error("query function not defined for Select2 " + opts.element.attr("id"));
}
Sekarang semuanya tampaknya berfungsi dengan baik tetapi masih melakukan kesalahan jika saya ingin mencoba dan mencari tahu apa sebenarnya dalam kode saya yang menyebabkan kesalahan. Tetapi untuk saat ini, ini adalah perbaikan yang cukup baik untuk saya.
gunakan:
try {
$("#input-select2").select2();
}
catch(err) {
}