Multiples <Select> begrenzen
skiddo
- javascript
Hi!
Ich will gerne ein multiples Selectfeld via Javascript auf maximal x Auswahlen begrenzen.
Dafür zähle ich mit der Funktion count(), welche im onClick Event des <select> Tags aufgerufen wird, wie viele Einträge schon selektiert sind, und vergleiche das mit meiner Variable, in der steht, wie viele maximal selektiert werden dürfen. Klappt wunderbar, nur kann ich leider nicht verhindern, das weiter selektiert wird :) Die Konsole liefert mir richtige Werte.
mit return false dachte ich, wird der Click dann nicht weiter ausgeführt, leider klappt das aber nicht.
Falls jemand eine Idee hat, währe ich sehr dankbar.
Ich habe auch schon gedacht, ob ich evtl. die Funktion count() im <option> Tag ausrufen muss, nur erstelle ich die <option> Tags aus einem Array mit options.add(), wenn ich da noch einen Eventhandler einschalt, braucht die Seite auf einmal 14 Sekunden zum laden (Bei ca. 1000 Einträgen im Array):
function addOption(selectBox,text,value) {
var newOption = document.createElement("option");
newOption.text = text;
newOption.value = value;
// newOption.onclick = count();
selectBox.options.add(newOption);
}
Hier der Code für die Funktion count():
function count(event) {
aktSelected = 0;
// Zählen, wieviele Objekte angewählt sind
for(i = 0; i < document.mainForm.zaehler.length; i++) {
if(document.mainForm.zaehler.options[i].selected == true)
aktSelected++;
}
// Wenn maximale Anzahl erreich ist, nichts mehr selektieren
if(aktSelected >= maxSelected)
return false;
else
return aktSelected;
}
Bitte nicht den Sinn hinterfragen, es ist so gefordert.
Schönen Gruß,
skiddo
Hi,
mit return false dachte ich, wird der Click dann nicht weiter ausgeführt, leider klappt das aber nicht.
Und wenn du dann einfach die letzte Auswahl wieder rückgängig machst?
Ich habe auch schon gedacht, ob ich evtl. die Funktion count() im <option> Tag ausrufen muss, nur erstelle ich die <option> Tags aus einem Array mit options.add(), wenn ich da noch einen Eventhandler einschalt, braucht die Seite auf einmal 14 Sekunden zum laden (Bei ca. 1000 Einträgen im Array):
Natürlich, weil du es falsch gemacht hast:
function addOption(selectBox,text,value) {
var newOption = document.createElement("option");
newOption.text = text;
newOption.value = value;
// newOption.onclick = count();
Hiermit rufst du die Funktion check an genau dieser Stelle auf - d.h., bei tausend Options wird sie tausend mal während deren Erstellung ausgeführt.
`newOption.onclick = count;`{:.language-javascript}
wäre die korrekte Schreibweise.
MfG ChrisB
--
RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
Hallo
Danke ChrisB für deine schnelle Hilfe, hat mir geholfen.
count() rufe ich nun über
newOption.onclick = function { count(value) };
auf und kann damit auch direkt den angeklickten <option> identifizieren.
Diesen deselektier ich dann wieder mit
document.mainForm.zaehler.options(value).selected = false;
Dankeschön!
Nur ein kleiner Kratzer ist noch drinne, wenn ich schnell rumklicke, kann ich mehr selektieren, als ich eigentlich dürfte. Aber Naja, ist halt so.
Hilfreich wäre ein maxselect Attribut für <select> Tags..
Schönen Tag!
skiddo