सेट डेटा AJAX

Question

मैं AJAX के साथ Select2 (नीचे कोड) का उपयोग कर रहा साथ डालने के बाद:

$(".select2-ajax").select2({ 
     placeholder: "Search user", 
     minimumInputLength: 1, 
     ajax: { 
      url: $('#url-search-client').val(), 
      dataType: 'json', 
      type: 'post', 
      data: function (term, page) { 
      return { 
       filter: term 
      }; 
      }, 
      results: function (data, page) { 
      return {results: data}; 
      } 
     }, 
     width : '50%', 
     formatInputTooShort: function() {return 'Informe mais caracteres'; }, 
     formatResult: formatResultSelectAjax, // omitted for brevity, see the source of this page 
     formatSelection: formatSelectAjaxValue, // omitted for brevity, see the source of this page 
     dropdownCssClass: "bigdrop" // apply css that makes the dropdown taller 
    }); 

ठीक है, नहीं तो ग्राहक मिल गया है, उपयोगकर्ता एक मॉडल को खोलने के लिए एक बटन का उपयोग किया जा सकता है और नया क्लाइंट जोड़ें, संभव है कि नए ग्राहक के रिटर्न (आईडी और नामे के साथ जेसन) का उपयोग करें और चयनित डेटा के रूप में डेटा (जैसे नाम) को चुनें।

$('.btn-form-client').click(function() { 
     $.ajax({ 
      url: $('#frm-client').attr('action'), 
      dataType: 'json', 
      type: 'post', 
      data: $('#frm-client').serialize() 
     }).done(function (data) { 
      $('#modal-client').modal('hide') 
     }); 
     return false; 
    }); 

Answer 1

मैं इसे काम करने में कामयाब रहा। jQuery में पोस्ट करने के बाद, मैं नए डेटा से एक JSON हो और छिपा इनपुट सेट का चयन करें ('.select2-ajax')

$('#client=id').val(data.id); 
$('#modal-solicitante').modal('hide'); //This is my 
$(".select2-ajax").select2('data', {id: data.id, name: data.name, email: data.email}); 

Answer 2

v4.x में शुरू, Select2 अब छिपा input क्षेत्र का उपयोग करता । इसके बजाय, आप create a new Option और यह आपके select तत्व को संलग्न:

var newOption = new Option(data.name, data.id, true, true); 
$(".select2-ajax").append(newOption).trigger('change'); 

true तर्क के संयोजन और trigger('change') अपने नए <option> स्वचालित रूप से जोड़ा जा रहा है के बाद चयन किया जाता है सुनिश्चित करेंगे।

एक पूर्ण कार्य उदाहरण के लिए मेरे codepen देखें।