टैग्स

Question

के रूप में ऑब्जेक्ट्स के साथ बूटस्ट्रैप 3 टाइपहेड और टैग इनपुट को एकीकृत करें मुझे टैग इनपुट के साथ बूटस्ट्रैप 3 टाइपहेड को एकीकृत करने में समस्याएं हैं लेकिन टैग के रूप में ऑब्जेक्ट्स के साथ। यह काम करता है अगर मैं इनपुट फ़ील्ड पर केवल टाइपहेड का उपयोग करता हूं, लेकिन अगर मैं इसे टैग इनपुट के साथ एकीकृत करता हूं तो यह काम नहीं करता है और मुझे कोई भी त्रुटि नहीं मिलती जो वास्तव में निराशाजनक है। यहां मेरा कोड है:

var places = [{name: "New York"}, {name: "Los Angeles"}]; 
//this works 
$('input').typeahead({ 
    source: places 
}); 

//this doesn't 
$('input').tagsinput({ 
    freeInput: false, 
    confirmKeys: [44], 
    typeahead: { 
     source: places 
    } 
}); 

क्या मैं कुछ गलत कर रहा हूं या यह एक बग है?

अगर किसी के पास इसका एक उदाहरण है तो मैं वास्तव में कुछ मदद की सराहना करता हूं, यह बूटस्ट्रैप 3 टाइपहेड के बजाय typeahead.js हो सकता है, मैंने इसका उपयोग करने की कोशिश की और यह काम करता है लेकिन फिर मुझे एक समस्या है मैं टाइपहेड क्लिक से एक सुझाए गए विकल्प का चयन करता हूं, एक टैग के रूप में बस उस विकल्प को स्वीकार करने के बजाय पूरे फॉर्म को सबमिट करता है।

Answer 1

आपको typeahead विकल्प के माध्यम से टैगइनपुट पर टाइपहेड संलग्न करना चाहिए! यह बहुत आसान है (और docs suggests क्या है)। फिर, अगर आप map()places तार की एक सरणी यह ​​काम करता है के लिए:

$('.tagsinput-typeahead').tagsinput({ 
    // other tagsinput options here 
    typeahead: { 
    source: places.map(function(item) { return item.name }), 
    afterSelect: function() { 
     this.$element[0].value = ''; 
    } 
    } 
}) 

डेमो ->http://jsfiddle.net/gm3a1s9k/1/

सूचना afterSelect(), it is needed in order to clear the input।