jQuery चुना विकल्प जोड़ने प्लगइन गतिशील

Question

मैं एक jQuery चुना ड्रॉप-डाउन इस तरह करते हैं:

$('.blah').chosen(); 

मैं कैसे मैं विकल्प जोड़ सकते नहीं मिल रहा है, कुछ की तरह:

$('.blah').chosen('add', name, value); 

Answer 1

सबसे पहले, आपको <option> एस <select> पर जोड़ना होगा जो चुना गया था। उदाहरण के लिए: (यद्यपि आप Change/Update Events के लिए नीचे स्क्रॉल करने की जरूरत है)

$('.blah').trigger("chosen:updated"); 

अधिक जानकारी here पाया जा सकता है:

$('.blah').append('<option value="foo">Bar</option>'); 

उसके बाद, आप chosen:updated घटना को गति प्रदान करने की जरूरत है।

---

अपडेट 7 वीं अगस्त 2013

घटना नाम संस्करण 1.0 (जुलाई 2013) टोनी टिप्पणी में उल्लेख के रूप में के बाद से chosen:updated बदल गया है। अद्यतन दस्तावेज here पाया जा सकता है।

Answer 2

नवीनतम संस्करण के लिए चुना घटना नाम बदल कर "चुना: अद्यतन"

तो अपने कोड इस तरह होगा: आप को बचाने के बाद

$('.blah').append("<option value='"+key+"'>"+value+"</option>"); 
$('.blah').val(key); // if you want it to be automatically selected 
$('.blah').trigger("chosen:updated"); 

Answer 3

आप तत्व जोड़ने के लिए इस समारोह कॉल कर सकते हैं चुना करने के लिए अजाक्स का उपयोग सर्वर से तत्व:

function appendToChosen(id,value){ 
    $('.blah') 
     .append($('<option></option>') 
     .val(id) 
     .attr('selected', 'selected') 
     .html(value)).trigger('liszt:updated'); 
} 

अजाक्स कॉल:

$.ajax({ 
    type: 'POST', 
    url: 'savepage.php', 
    data: $('#modal-form form').serialize(), 

    success: function(data, status) { 
     appendToChosen(data[0],data[1]); 
    }, 
    error: function (response) { 
     alert(response); 
    } 
    }).always(function(data, status) { 
     //hide loading 
    }); 

Answer 4

इस प्रयास करें ..

  $.ajax({ 
      url: "@Url.Action("Actionname", "Controller")", 
      data: { id: id }, 
       dataType: "json", 
       type: "POST", 
       success: function (data) { 
       $("#id_chzn .chzn-results").children().remove(); 
       var opts = $('#id')[0].options; 
        $.map(data, function (item) { 
         var text = item.text; 
         for (var i = 0; i < opts.length ; i++) { 
          var option = opts[i]; 
          var comparetext = option.innerText; 
          var val = 0; 
          if(text == comparetext) 
          { 
           val = option.index; 
           $('#id_chzn .chzn-results').append("<li id='id_chzn" + val + "' class='active-result' style>" + item.text + "</li>"); 
          } 
         } 
        }); 
        } 
       });