Cách lấy Văn bản đã Chọn từ select2 khi sử dụng <input>

Tôi đang sử dụng điều khiển select2, tải dữ liệu qua ajax. Điều này yêu cầu sử dụng <input type=hidden..>thẻ.

Bây giờ, tôi muốn truy xuất văn bản đã chọn. ( valueThuộc tính trong data-bindbiểu thức là idduy nhất)

Tôi đã thử $(".select2-chosen").text(), nhưng điều này bị hỏng khi tôi có nhiều điều khiển select2 trên trang.

Kể từ Select2 4.x, nó luôn trả về một mảng, ngay cả đối với danh sách không có nhiều lựa chọn.

var data = $('your-original-element').select2('data')
alert(data[0].text);
alert(data[0].id);

Đối với Select2 3.x trở xuống

Chọn một lần:

var data = $('your-original-element').select2('data');
if(data) {
  alert(data.text);
}

Lưu ý rằng khi không có lựa chọn, biến 'dữ liệu' sẽ là giá trị rỗng.

Nhiều lựa chọn:

var data = $('your-original-element').select2('data')
alert(data[0].text);
alert(data[0].id);
alert(data[1].text);
alert(data[1].id);

Từ tài liệu 3.x :

dữ liệu Nhận hoặc thiết lập lựa chọn. Tương tự với phương thức val, nhưng hoạt động với các đối tượng thay vì id.

phương thức dữ liệu được gọi trên một phép chọn với giá trị chưa được đặt sẽ trả về giá trị rỗng, trong khi phương thức dữ liệu được gọi trên một phép chọn trống sẽ trả về [].

Cuối cùng tôi đã tìm ra cách làm này:

var $your-original-element = $('.your-original-element');
var data = $your-original-element.select2('data')[0]['text'];
alert(data);

nếu bạn cũng muốn giá trị:

var value = $your-original-element.select2('data')[0]['id'];
alert(value);

Đã sử dụng cái này để hiển thị văn bản

var data = $('#id-selected-input').select2('data'); 
data.forEach(function (item) { 
    alert(item.text); 
})

Ngoài ra, bạn có thể có giá trị đã chọn bằng cách sử dụng mã sau:

alert("Selected option value is: "+$('#SelectelementId').select2("val"));

Đoạn mã dưới đây cũng giải quyết khác

.on("change", function(e) {

  var lastValue = e.currentTarget.value;
  var lastText = e.currentTarget.textContent;

 });

Cách chính xác để làm điều này kể từ phiên bản 4 là:

$('.select2-chosen').select2('data')[0].text

Nó không có giấy tờ nên có thể bị hỏng trong tương lai mà không cần cảnh báo trước.

Trước tiên, bạn có thể muốn kiểm tra xem có lựa chọn nào không:

var s = $('.select2-chosen');

if(s.select2('data') && !!s.select2('data')[0]){
    //do work
}

Một lần nữa tôi đề nghị Đơn giản và Dễ dàng

Hoạt động hoàn hảo với ajax khi người dùng tìm kiếm và chọn nó sẽ lưu thông tin đã chọn qua ajax

 $("#vendor-brands").select2({
   ajax: {
   url:site_url('general/get_brand_ajax_json'),
  dataType: 'json',
  delay: 250,
  data: function (params) {
  return {
    q: params.term, // search term
    page: params.page
  };
},
processResults: function (data, params) {
  // parse the results into the format expected by Select2
  // since we are using custom formatting functions we do not need to
  // alter the remote JSON data, except to indicate that infinite
  // scrolling can be used
  params.page = params.page || 1;

  return {
    results: data,
    pagination: {
      more: (params.page * 30) < data.total_count
    }
  };
},
cache: true
},
escapeMarkup: function (markup) { return markup; }, // let our custom    formatter work
minimumInputLength: 1,
}).on("change", function(e) {


  var lastValue = $("#vendor-brands option:last-child").val();
  var lastText = $("#vendor-brands option:last-child").text();

  alert(lastValue+' '+lastText);
 });

Cái này hoạt động tốt khi sử dụng V 4.0.3

var vv = $('.mySelect2');     
var label = $(vv).children("option[value='"+$(vv).select2("val")+"']").first().html();
console.log(label); 

Trong Select2 phiên bản 4, mỗi tùy chọn có cùng thuộc tính của các đối tượng trong danh sách;

nếu bạn có đối tượng

Obj = {
  name: "Alberas",
  description: "developer",
  birthDate: "01/01/1990"
}

sau đó bạn truy xuất dữ liệu đã chọn

var data = $('#id-selected-input').select2('data');
console.log(data[0].name);
console.log(data[0].description);
console.log(data[0].birthDate);