Situatie:
Ben bezig met het bouwen ener combobox. Dat is een input-veld met een select-lijst eronder. Het script zoekt - zodra de user iets intypt in het input-veld - de meest gelijkende optie uit de select-lijst op.
De globale opbouw is als volgt:
Probleem:
Bij grote lijsten (zeg 5000 opties) doet zich een probleem voor. Mijn zoekscript wordt dan wat trager. Hierdoor kun je niet meer snel typen in het input-veld, aangezien hij na iedere toetsaanslag eerst in de select-lijst gaat zoeken.
Vraag:
Is het mogelijk om een vertraging in te bouwen. In gewoon Nederlands:
"Wacht X milliseconden alvorens in de select-lijst te gaan zoeken; zodra er in die X milliseconden op een toets wordt gedrukt, zet dan de teller weer op nul en ga opnieuw zitten wachten"
Ik heb zitten prutsen met setTimeout in de functie handleComboInputOnKeyup:
Maar dat werkt niet, aangezien 'event' niet gedefinieerd is..
Ben bezig met het bouwen ener combobox. Dat is een input-veld met een select-lijst eronder. Het script zoekt - zodra de user iets intypt in het input-veld - de meest gelijkende optie uit de select-lijst op.
De globale opbouw is als volgt:
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
| <script type="text/javascript"> function handleComboInputOnKeyup(keyboardEvent, oInput) { //get keyboard code of key pressed var unicode=keyboardEvent.keyCode? keyboardEvent.keyCode : keyboardEvent.charCode; (...) //zoek waarde op in select-box alert(searchSelectbox(oSelect, oInput.value)); } function searchSelectbox(oSelect, iSearchString) { (...) return iIndex; } </script> function <input id="myInput" onkeyup="handleComboInputOnKeyup(event, this)" type="text"> <select id="mySelect"> <option>...</option> </select> |
Probleem:
Bij grote lijsten (zeg 5000 opties) doet zich een probleem voor. Mijn zoekscript wordt dan wat trager. Hierdoor kun je niet meer snel typen in het input-veld, aangezien hij na iedere toetsaanslag eerst in de select-lijst gaat zoeken.
Vraag:
Is het mogelijk om een vertraging in te bouwen. In gewoon Nederlands:
"Wacht X milliseconden alvorens in de select-lijst te gaan zoeken; zodra er in die X milliseconden op een toets wordt gedrukt, zet dan de teller weer op nul en ga opnieuw zitten wachten"
Ik heb zitten prutsen met setTimeout in de functie handleComboInputOnKeyup:
JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
13
| function handleComboInputOnKeyup(keyboardEvent, oInput) { //pause for 100ms and wait for key press setTimeout(function(){if(event){handleComboInputOnKeyup(event, oInput, oDiv, oSelect)}}, 100); //get keyboard code of key pressed var unicode=keyboardEvent.keyCode? keyboardEvent.keyCode : keyboardEvent.charCode; (...) //zoek waarde op in select-box alert(searchSelectbox(oSelect, oInput.value)); } |
Maar dat werkt niet, aangezien 'event' niet gedefinieerd is..