jQuery Select2-Tag bei Unschärfe

Question

Ich verwende Select2, um ein Feld für E-Mail-Adressen im Gmail-Stil in meiner Anwendung zu erstellen. Es funktioniert gut, bis auf einen Fall: wenn der Benutzer eine E-Mail-Adresse eingibt und hinter ihm kein Leerzeichen oder Komma steht und nicht auf Enter oder Tab drückt. Wenn sie beispielsweise nur eine E-Mail-Adresse eingeben und dann mit der Maus das nächste Feld im Formular auswählen, wird die eingegebene E-Mail-Adresse nicht mehr angezeigt.

Ich habe ein Beispiel jsfiddle here, das das Problem veranschaulicht.

Hier ist, wie ich einrichten select2 auf meinem versteckten Eingang:

$(function(){ 
    $('input').select2({ 
     tags: [], 
     width: "300px", 
     dropdownCss: {display: 'none'}, 
     tokenSeparators: [',', ', ', ' '] 
    }); 
}); 

Gibt es eine Möglichkeit für mich select2 einzurichten, so dass onBlur dauert es nur, was übrig ist und ist nicht ein Tag und macht es eins?

Answer 1

Dies wird jetzt in Version 3.3 der select2-Bibliothek mit der Option 'selectOnBlur' unterstützt.

Answer 2

ich wirklich nicht verstehen, was Sie versuchen, hier zu tun, weil Sie über E-Mails sprechen:

jQuery(element.val().split(",")).each(function() { 
       data.push({id: this, text: this}); 
      }); 

Aber man könnte versuchen, diese stattdessen:

var splitted = element.val().split(","); 
for(var i=0,z=splitted.length;i<z;i++) 
    data.push({id: splitted[i], text: splitted[i]}); 

By the way, Ihre jsfiddle ist unvollständig.

Answer 3

Ich hatte ein Formular mit select2 (Tag-Modus) und einen Absenden-Button. Wenn der Benutzer ein Tag eingibt, ohne das Tag aus dem Drop-down-Menü auszuwählen oder einen der Trigger-Steuerschlüssel zu drücken, geht der Benutzereintrag standardmäßig verloren, da das Plugin das generierte Eingabedom-Objekt beim Blur-Ereignis schließt.

Meine schnelle Lösung für dieses Problem war die Plugin Unschärfefunktion zu hacken und die folgenden Zeilen hinzufügen:

var val=this.search.val(); 
if($.trim(val)!='') this.onSelect({id:val,text:val}); 

Sobald Unschärfe-Funktion aufgerufen wird, wird die oben genannte Code prüft, ob Benutzereingabe. Wenn dies der Fall ist, wird das Ereignis ausgewählt und das erforderliche Objekt gesendet. Das Objekt, das ich passiere, ist nur für select2 im Tagging-Modus geeignet und wenn du select2 v3.2 verwendest, kann diese Zeile am Anfang der Unschärfe-Funktion von AbstractSelect2 in Zeile 1311 eingefügt werden. Ich hoffe, dass du damit eine Idee hast, wie du das anpassen kannst Widget nach Ihren Bedürfnissen.

Answer 4

Vom documentation ab 4.0.3:

$('select').select2({ 
    selectOnClose: true 
}); 

Dies wird die Auswahl erfassen und einen Tag erstellen, wenn der Benutzer an anderer Stelle klickt.