Dinamik seçme birden jQuery eklentisi seçilen seçeneği eklemek

Question

Ben seçenek değil, bir kullanıcı bir seçenek olarak seçilmiş seçkin çoklu giriş metin alanına girişler, otomatik, bütün bunlar seçmek metin eklemek istediğiniz

Varsa, seçenek varsa, onu seçmek istiyorum. Şimdiye kadar bunu yapmak yönetmek adres: giriş alanı keydown_check fonksiyonu içinde odak iken kullanıcıların presler girin her

Chosen.prototype.add_text_as_option = function() { 
    $('#id_select').append(
     $('<option>') 
       .html(this.search_field.val()) 
       .attr('selected', 'selected') 
       .attr('value', 0) 
    ); 
    $('#id_select').trigger("liszt:updated"); 
    return false; 
}; 

bu işlevi çağırmak.

Ben iki sorun var: Kullanıcı presler girip bir seçeneğin bir alt daktilo zaman,

• Üst öncelik, seçenek seçili olsun olmaz, ancak alt dize metni eklendi ve seçilecektir. İstediğimi değil.
Örneğin

: Ben seçeneği "foo" var ve ben enter tuşuna basın eğer öyleyse, aday olarak ilk seçeneği ("foo") işaretler seçilmiş, "fo" yazmaya başlayın, bu seçilmelidir ancak bunun yerine, "fo" nun bir seçenek olarak eklenmesi ve "foo" yu seçmek istediğimde seçili olması.

Bir tıklamayla "foo" yu seçersem, her şey yolunda gider. Seçilen işaretler seçilir ve alt yazı metni seçeneğin bir parçası olarak alınır.

Tüm özgün işlevleri kaybetmeden, varolmayan bir seçeneği nasıl ekleyebilirim?

• Seçtiğiniz eklenti içinde seçilen seçili çoklu alan I'ye nasıl erişebilirim? Yukarıdaki kodda gördüğünüz gibi, select multiple alanının kimliği hardcoded. Kullanıcı yeni bir seçenek eklediğinde seçimi yenileyebilmek için bunu yapmak istiyorum.

• aradığım işlevselliği önceden linkedin

sayesinde becerilerini widget'ı çok benzer!

Answer 1

Sen seçilmiş Eklentinin kapalı dayanır Select2 eklentisi denemek gerekir ama dinamik öğelerin eklenmesi ile iyi çalışır.

İşte bağlantıya

: Otomatik simgelileştirme için örneğe http://ivaynberg.github.com/select2/

Look ben eğer aradığınız ne olabileceğini düşünüyorum.

$(function() { 
    // form id 
    $('#newtag').alajax({ 
     // data contains json_encoded array, sent from server 
     success: function(data) { 
      // this is missing in alajax plugin 
      data = jQuery.parseJSON(data); 
      // create new option for original select 
      var opt = document.createElement("OPTION"); 
      opt.value = data.id; 
      opt.text = data.name; 
      opt.selected = true; 
      // check if the same value already exists 
      var el = $('#tags option[value="' + opt.value + '"]'); 
      if(!el.size()) { 
       // no? append it and update chosen-select field 
       $('#tags').append(opt).trigger("chosen:updated"); 
      } else { 
       // it does? check if it's already selected 
       if(!el[0].selected) { 
        // adding already existent element in selection 
        el[0].selected = true; 
        $('#tags').trigger("chosen:updated"); 
       } else { 
        alert("Already selected and added."); 
       } 
      } 


     } 
    }) 
}); 

"#" newtag şeklidir:

Answer 2

Attırılmak mektup Bunu bugün bu yüzden böyle bir şey yazdı gerekli keyup_check

Answer 3

aksine başlatılmadan önce bu keydown_check denir keyup_check çağrı ".alajax", form verilerini eşzamansız olarak gönderen ve sunucunun yanıtını JSON biçiminde döndüren plugin şeklindedir. Denetleyicide bir etiket olup olmadığını kontrol ederim, aksi takdirde oluşturuyorum. Yanıt olarak beş "jsoned" etiketi nesnesi.

Answer 4

Metin alan ve seçenek olarak oluşturulmuş jquery jsfiddle öğesini oluşturdum.Seçilen jquery'nin önceki versiyonunda tesis oluşturma seçeneği vardır.

create_option: true; 
persistent_create_option: true; 
skip_no_results: true; 

Bu kodu kullanabilirsiniz:

$('#id_select').chosen({ 
    width: '100%', 
    create_option: true, 
    persistent_create_option: true, 
    skip_no_results: true 
}); 

jsfiddle linki: buldum

Answer 5

https://jsfiddle.net/n4nrqtek/ bir çözüm birden

var str_array = ['css','html']; 
$("#id_select").val(str_array).trigger("chosen:updated");