Đang cố gắng sử dụng Select2 và gặp lỗi này trên nhiều mục nhập / trường văn bản:
"query function not defined for Select2 undefined error"
Đang cố gắng sử dụng Select2 và gặp lỗi này trên nhiều mục nhập / trường văn bản:
"query function not defined for Select2 undefined error"
Câu trả lời:
Được đề cập trong chuỗi nhóm google này
Vấn đề là do div bổ sung được thêm vào bởi select2. Select2 đã thêm div mới với lớp "select2-container form-select" để bọc vùng chọn đã tạo. Vì vậy, trong lần tiếp theo tôi tải hàm, lỗi sẽ xuất hiện vì select2 đang được gắn vào phần tử div. Tôi đã thay đổi bộ chọn của mình ...
Tiền tố select2 mã định danh css với tên thẻ cụ thể "select":
$('select.form-select').select2();
$(document).ready(function() { $('select.form-select').select2()})
.select2({})
phương thức. Một giải pháp tốt hơn sẽ là gọi phương thức hủy trước. Ví dụ:$("#mySelectControl").select2("destroy").select2({});
Trong trường hợp bạn khởi tạo một đầu vào trống, hãy làm như sau:
$(".yourelement").select2({
data: {
id: "",
text: ""
}
});
Đọc bình luận đầu tiên bên dưới, nó giải thích tại sao và khi nào bạn nên sử dụng mã trong câu trả lời của tôi.
select2()
sẽ không chỉ đơn giản là chỉ chấp nhận các thông số rỗng
Tôi cũng gặp sự cố này, hãy đảm bảo rằng bạn không khởi tạo select2 hai lần.
Đối với tôi, vấn đề này bắt nguồn từ việc đặt thuộc tính data-ui-select2 chính xác:
<input type="text" data-ui-select2="select2Options.projectManagers" placeholder="Project Manager" ng-model="selectedProjectManager">
$scope.projectManagers = {
data: [] //Must have data property
}
$scope.selectedProjectManager = {};
Nếu tôi tháo data
tài sản trên, $scope.projectManagers
tôi sẽ gặp lỗi này.
Vấn đề này bắt nguồn từ cách tôi tạo hộp chọn select2 của mình. Trong một tệp javascript, tôi có ...
$(function(){
$(".select2").select2();
});
Và trong một tệp js khác ghi đè ...
$(function(){
var employerStateSelector =
$("#registration_employer_state").select2("destroy");
employerStateSelector.select2({
placeholder: 'Select a State...'
});
});
Di chuyển ghi đè thứ hai vào một sự kiện tải cửa sổ đã giải quyết được sự cố.
$( window ).load(function() {
var employerStateSelector =
$("#registration_employer_state").select2("destroy");
employerStateSelector.select2({
placeholder: 'Select a State...'
});
});
Vấn đề này phát sinh bên trong ứng dụng Rails
Tôi cũng gặp lỗi tương tự khi sử dụng ajax với hộp văn bản, sau đó tôi giải quyết nó bằng cách xóa lớp select2 của hộp văn bản và thiết lập select2 bằng id như:
$(function(){
$("#input-select2").select2();
});
Có vẻ như bộ chọn của bạn trả về một phần tử không xác định (Do đó undefined error
được trả về)
Trong trường hợp phần tử thực sự tồn tại, bạn đang gọi select2 trên một input
phần tử mà không cung cấp bất kỳ thứ gì cho select2, nơi nó sẽ tìm nạp dữ liệu từ đó. Thông thường, một cuộc gọi .select2({data: [{id:"firstid", text:"firsttext"}])
.
Cũng gặp lỗi tương tự khi sử dụng ajax.
Nếu bạn đang sử dụng ajax để hiển thị biểu mẫu bằng select2, thì lớp input_html phải khác với những lớp KHÔNG được hiển thị bằng ajax. Không hoàn toàn chắc chắn tại sao nó hoạt động theo cách này.
if (typeof(opts.query) !== "function") {
throw "query function not defined for Select2 " + opts.element.attr("id");
}
Đây là truy vấn chữ hoa ném không tồn tại trong các tùy chọn. Nội bộ có kiểm tra được duy trì yêu cầu một trong những điều sau đây cho các thông số
Vì vậy, bạn chỉ cần cung cấp một trong 4 tùy chọn này để select2 và nó sẽ hoạt động như mong đợi.
Tôi cũng mắc lỗi tương tự. Tôi đã sử dụng select2-3.5.2
Đây là mã của tôi bị lỗi
$('#carstatus-select').select2().val([1,2])
Mã bên dưới đã khắc phục sự cố.
$('#carstatus-select').val([1,2]);
Tôi có một Ứng dụng web phức tạp và tôi không thể tìm ra chính xác lý do tại sao lại xảy ra lỗi này. Nó đã khiến JavaScript bị hủy bỏ khi được ném.
Trong select2.js, tôi đã thay đổi:
if (typeof(opts.query) !== "function") {
throw "query function not defined for Select2 " + opts.element.attr("id");
}
đến:
if (typeof(opts.query) !== "function") {
console.error("query function not defined for Select2 " + opts.element.attr("id"));
}
Bây giờ mọi thứ dường như hoạt động bình thường nhưng nó vẫn bị lỗi khi đăng nhập trong trường hợp tôi muốn thử và tìm ra chính xác điều gì trong mã của tôi đang gây ra lỗi. Nhưng hiện tại đây là một bản sửa lỗi đủ tốt cho tôi.
sử dụng :
try {
$("#input-select2").select2();
}
catch(err) {
}