Hallo zusammen,
ich wollte mir ein Multiples Input erstellen wo mehrere Daten ausgewählt werden können.
Allerdings springt er immer wenn ich "KOMMA & LEERTASTE (, )" drücke, um 1 Zeichen nach hinten und dann kann ich nicht mehr einfachheitshalber ein
Buchstaben eingeben und es aussuchen. Ich muss dann immer 1 Buchstaben an das "KOMMA (,)" setzen und hinter den Buchstaben eine "LEERTASTE ( )" machen.
Erst dann wird mir wieder ein neuer Name vorgeschlagen.
Ich würde also gerne wissen, wie ich am besten das verhinder mit dem 1 Zeichen zurück.
Also wie kann ich am besten ein Buchstaben eingeben... Auswählen was ich haben will... Dann "KOMMA & LEERTASTE (, )"... Wieder ein Buchstaben eingeben, Auswählen was ich haben will ... und so weiter ???
Mein Code:
Ich habe schon mehrere Varianten versucht...
Dann hab ich das versucht...
und vieles mehr... ich bin mit meinem Latein am ende :/
ich wollte mir ein Multiples Input erstellen wo mehrere Daten ausgewählt werden können.
Allerdings springt er immer wenn ich "KOMMA & LEERTASTE (, )" drücke, um 1 Zeichen nach hinten und dann kann ich nicht mehr einfachheitshalber ein
Buchstaben eingeben und es aussuchen. Ich muss dann immer 1 Buchstaben an das "KOMMA (,)" setzen und hinter den Buchstaben eine "LEERTASTE ( )" machen.
Erst dann wird mir wieder ein neuer Name vorgeschlagen.
Ich würde also gerne wissen, wie ich am besten das verhinder mit dem 1 Zeichen zurück.
Also wie kann ich am besten ein Buchstaben eingeben... Auswählen was ich haben will... Dann "KOMMA & LEERTASTE (, )"... Wieder ein Buchstaben eingeben, Auswählen was ich haben will ... und so weiter ???
Mein Code:
PHP-Code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script type="text/javascript">
var datalist = jQuery('datalist');
var options = jQuery('datalist option');
var optionsarray = jQuery.map(options ,function(option) {
return option.value;
});
var input = jQuery('input[list]');
var inputcommas = (input.val().match(/,/g)||[]).length;
var separator = ',';
function filldatalist(prefix) {
if (input.val().indexOf(separator) > -1 && options.length > 0) {
datalist.empty();
for (i=0; i < optionsarray.length; i++ ) {
if (prefix.indexOf(optionsarray[i]) < 0 ) {
datalist.append('<option value="'+prefix+optionsarray[i]+'">');
}
}
}
}
input.bind("change paste keyup", function() {
var inputtrim = input.val().replace(/^\s+|\s+$/g, "");
//console.log(inputtrim);
var currentcommas = (input.val().match(/,/g)||[]).length;
//console.log(currentcommas);
if (inputtrim != input.val()) {
if (inputcommas != currentcommas) {
var lsIndex = inputtrim.lastIndexOf(separator);
var str = (lsIndex != -1) ? inputtrim.substr(0, lsIndex)+", " : "";
filldatalist(str);
inputcommas = currentcommas;
}
input.val(inputtrim);
}
});
</script>
PHP-Code:
var str = (lsIndex != -1) ? inputtrim.substr(0, lsIndex)+", " : "";
/* wurde dann zu */
var str = (lsIndex != -1) ? inputtrim.substr(0, lsIndex)+"," : "";
/* oder */
var str = (lsIndex != -1) ? inputtrim.substr(0, lsIndex)+", " : ", ";
/* oder */
var str = (lsIndex != -1) ? inputtrim.substr(0, lsIndex)+", " : " ";
PHP-Code:
var inputtrim = input.val().replace(/^\s+|\s+$/g, "");
/* wurde zu */
var inputtrim = input.val().replace(/^\s+|\s+$/g, " ");
/* oder */
var inputtrim = input.val().replace(/^\s+|\s+$/g, ", ");
Kommentar