Verwendung von Select2 mit Inputmaske

Question

Ich versuche, eine Select2 Box mit InputMask zu erstellen, um IP-Adressen einzufügen und sie als Tags hinzuzufügen.

Wenn ich irgendeine der Bibliotheken für sich nutze, funktioniert es wie ein Zauber, aber beide zusammen ergeben seltsames Verhalten.

Wenn ich Zahlen eintippe, ist die Maske nicht gefüllt, sondern scheint sich zu erweitern.

änderte ich den Typ des select2 <input class=“select2-search__field“>search-text. Die Inputmask Bibliothek dies erforderlich macht, aber es sollte nicht zu Fehlern führen, weil die Typen sind functionally identical.

ich eine Fiddle erstellt, das Verhalten zu zeigen: Fiddle

HTML:

<select multiple id="sel1" style="width:100%"></select> 

JS:

$("#sel1") 
.select2({ 
    tags: true 
}) 
.on("select2:open", function() { 
    $(".select2-search__field") 
    .attr("type","text") 
    .inputmask({alias: "ip", greedy: false}); 
}) 

In meinem lokalen Beispiel habe ich die Bibliothek geändert, um search zu unterstützen, und das Verhalten ist das gleiche.

Fehle ich etwas?

Answer 1

Es gibt eine schlechte neue für Sie, wenn Sie Version 4.0.5 verwenden müssen.

Feste in jsfiddle von select2 auf Version 4.0.2

Die Hauptsache ist die Herabstufung Version < = 4.0.2

https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/js/select2.js

4.0.3 ab Versuchte bis 4.0.6-rc. 1 aber kein Glück.

Geöffnet issue select2#5216 mit select2.

Ich habe eine kleine Änderung, aber das hat nichts mit dem Problem selbst zu tun.

 $(".select2-search__field").attr('type', 'text'); 
     $(".select2-search__field").attr('style', 'width: 10em;'); 
     $(".select2-search__field") 
     .inputmask({ 
      alias: "ip" 
     });