चयन 2: कोड

Question

का उपयोग कर गतिशील रूप से नया टैग जोड़ें I टैगिंग के लिए चयन 2 का उपयोग कर रहा हूं और मेरे पास यह सेटअप है कि कोई उपयोगकर्ता भी नए टैग जोड़ सकता है। जिस मुद्दे के साथ मैं काम कर रहा हूं वह उपयोगकर्ता प्रविष्टि को मान्य कर रहा है और चयन के लिए स्वच्छता टैग जोड़ रहा है।

जब कोई उपयोगकर्ता किसी टैग में स्थान में प्रवेश करता है, तो अधिक विशिष्ट होने के लिए, मैं टैग को स्वच्छ करने के लिए जेएस लिंक प्रदर्शित करने के लिए प्रारूप नॉटमैच का उपयोग करता हूं और फिर टैग प्रोग्रामेटिक रूप से जोड़ता हूं। यह कोड त्रुटियों के बिना चल रहा है लेकिन जब sanitize कहा जाता है इनपुट के सभी चयन को मंजूरी दे दी जाती है।

कोई संकेत जहां मैं गलत हो रहा हूं?

var data=[{id:0,tag:'enhancement'},{id:1,tag:'bug'},{id:2,tag:'duplicate'},{id:3,tag:'invalid'},{id:4,tag:'wontfix'}]; 
function format(item) { return item.tag; } 

function sanitize(a){ 

    $("#select").select2('val',[{ 
     id: -1, 
     tag: a 
     }]); 

     console.log(a); 
}; 

$("#select").select2({ 
    tags: true, 
    // tokenSeparators: [",", " "], 
    createSearchChoice: function(term, data) { 
    return term.indexOf(' ') >= 0 ? null : 
    { 
     id: term, 
     tag: term 
     }; 
    }, 
    multiple: true, 
    data:{ results: data, text: function(item) { return item.tag; } }, formatSelection: format, formatResult: format, 
    formatNoMatches: function(term) { return "\"" + term + "\" <b>Is Invalid.</b> <a onclick=\"sanitize('"+ term +"')\">Clear Invalid Charecters</a>" } 
}); 

Answer 1

इस पर हैकिंग करने के बाद मुझे और एहसास हुआ कि मुझे "डेटा" संपत्ति में नया आइटम सेट करना चाहिए और मूल्य नहीं होना चाहिए।

var newList = $.merge($('#select').select2('data'), [{ 
     id: -1, 
     tag: a 
     }]); 
$("#select").select2('data', newList) 

Answer 2

आप नया मान सेट कर सकते हैं (यदि टैग आप सरणी पास कर सकते हैं) और 'परिवर्तन' ईवेंट ट्रिगर करें।

var field = $('SOME_SELECTOR'); 

field.val(['a1', 'a2', 'a3']) // maybe you need merge here 
field.trigger('change') 

बारे घटनाओं: https://select2.github.io/options.html#events

Answer 3

केवल इस समाधान मेरे लिए काम करता है:

function convertObjectToSelectOptions(obj){ 
    var htmlTags = ''; 
    for (var tag in obj){ 
     htmlTags += '<option value="'+tag+'" selected="selected">'+obj[tag]+'</option>'; 
    } 
    return htmlTags; 
} 
var tags = {'1':'dynamic tag 1', '2':'dynamic tag 2'}; //merge with old if you need 
$('#my-select2').html(convertObjectToSelectOptions(tags)).trigger('change');