Autocomplete-Tags mit Forcen und freiem Text
Ich muss eine mehrzeilige Textbox haben, in der ein freier Text erlaubt ist, aber wenn ich anfange, Zeichen einzugeben: "@@"
Die Autocomplete-Box mit den verfügbaren Tags sollte angezeigt werden und es mir ermöglichen, Tags aus vorhandenen Tags auszuwählen, und "@@" - Zeichen sollten nicht im Tag-Namen vorhanden sein.
Momentan spiele ich mit dem tag-it-Plugin für die jQuery-Benutzeroberfläche, kann aber nicht herausfinden, wie man freien Text zulässt und Nur shw Autocomplete-Box auf "@@" eingeben. und wie man textarea anstelle von regulären Eingaben benutzt.
Außerdem möchte ich sie zwingen, aus der Liste auszuwählen, wenn sie @@ eingeben und keinen freien Text eingeben (die erste verfügbare Auswahl wäre gut)
Javascript:
html:
%Vor%testet hier: Ссылка
2 Antworten
Da Sie das Tag-It-Plugin verwendet haben .. Ich habe einen Handler zur Eingabe hinzugefügt, um
zu behandeln-
@@, um die automatische Vervollständigung anzuzeigen, während Sie eingeben
- Freitext wenn eingegeben ohne
@@
Ich brauche noch Zeit, um in zu schauen. Lassen Sie keinen freien Text zu, wenn @@ getippt wird
DEMO: Ссылка und unten ist der vollständige Code,
Hinweis: Der folgende Code ist tweak für den vorhandenen Plugin-Code.
%Vor%Ich habe dafür ein Meteor Paket erstellt, das sowohl freien Text als auch mehrere automatische Vervollständigungsquellen erlaubt. Das Datenmodell von Meteor ermöglicht eine schnelle Suche nach mehreren Regeln mit benutzerdefinierten Listen. Wenn Sie Meteor nicht für Ihre Web-App verwenden, (ich glaube), werden Sie leider nichts finden, was für Autovervollständigung so großartig ist.
Autovervollständigen von Benutzern mit @ , wobei Online-Benutzer grün dargestellt werden:
In der gleichen Zeile, Autocompleten etwas anderes mit ! mit Metadaten und Bootstrap-Icons:
Fork, ziehen und verbessern: