"Chức năng truy vấn không được xác định cho lỗi không xác định Select2"


Câu trả lời:


241

Đượ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();

bằng cách nào đó đã sửa nó cho tôi, trong trường hợp của tôi, tôi đang sao chép một hàng đầu vào biểu mẫu bao gồm các menu chọn select2-ified và tất cả những thứ kỳ lạ đang xảy ra sau lần sao chép đầu tiên.
martincarlin87

Cũng phải ở trong$(document).ready(function() { $('select.form-select').select2()})
TED

1
Làm cách nào để giải quyết vấn đề tương tự trong chỉ thị Angular UI Select2?
zavidovych

Hôm nay vừa gặp phải vấn đề tương tự - mặc dù trước đó cùng một mã không có vấn đề gì (có lẽ là bản cập nhật của select2?). Dù sao, điều này cũng giải quyết được nó cho tôi và hoạt động tốt trở lại. Câu trả lời chính xác!
user756659

10
Sự cố này thường xảy ra nếu điều khiển chọn đã được khởi tạo bằng .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({});
Dmitry S.

18

Thông báo lỗi này quá chung chung. Một trong những nguồn khác có thể xảy ra là bạn đang cố gọi select2()phương thức trên đầu vào đã "select2ed".


13

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.


2
Tôi gặp sự cố này khi di chuyển hộp select2 từ một phần tử chọn thực tế sang một phần tử input type = hidden mà tôi sẽ điền sau này. Khi bước qua mã select2, lỗi này xảy ra do không có giá trị truy vấn, ajax, dữ liệu hoặc thẻ được chuyển vào.
Daniel

1
Đây phải là câu trả lời được chấp nhận cho câu hỏi này. Bạn không chắc chắn lý do tại sao select2()sẽ không chỉ đơn giản là chỉ chấp nhận các thông số rỗng
swdev

11

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 cũng vậy, nhưng lỗi không phải là vấn đề đối với tôi. s2 vẫn hoạt động
Reign. 85

làm như thế nào?
khaled saleh

7

Đố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 datatài sản trên, $scope.projectManagerstôi sẽ gặp lỗi này.


5

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


4

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();
});

3

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 inputphầ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"}]).


2

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.


Ý bạn là, "<input type = 'hidden' class = 'foo' ...." trong đó nếu bạn có nhiều select2, tất cả chúng không thể là 'foo'? Điều này không hiệu quả với tôi.
dethSwatch

1
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ố

  • ajax
  • thẻ
  • dữ liệu
  • truy vấn

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.


0

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 sẽ sử dụng $ ('# carstatus-select'). Select2 ("val", [1,2]); như đề cập trong các tài liệu
hakuna1811

0

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.


-2

sử dụng :

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

}

điều này sẽ chỉ ẩn lỗi, không sửa chữa nó. Đây không phải là giải pháp trong đại đa số các trường hợp
Ramses
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.