[JS] Item uit selectbox selecteren

Pagina: 1
Acties:

  • .Alex
  • Registratie: Augustus 2005
  • Laatst online: 01-08-2022
Bonjour,

Hoe kan ik een item uit een bepaalde selectbox selecteren d.m.v. javascript?

Stel:
Ik heb de volgende selectbox:
- item1
- item2
- item3

En dan wil ik graag dat "item2" of "item3" bij onload van de pagina geselecteerd wordt. Hoe doe ik dat?

(en ja, ik heb al gezocht.. kon het alleen niet vinden..)


Groet,

.Alex

[ Voor 10% gewijzigd door .Alex op 28-06-2006 17:28 ]


  • TeeDee
  • Registratie: Februari 2001
  • Laatst online: 15-02 21:52

TeeDee

CQB 241

Wat heb je dan al geprobeerd?
Alleen zoeken (en niets kunnen vinden) is niet voldoende.

Heart..pumps blood.Has nothing to do with emotion! Bored


  • .Alex
  • Registratie: Augustus 2005
  • Laatst online: 01-08-2022
TeeDee schreef op woensdag 28 juni 2006 @ 17:31:
Wat heb je dan al geprobeerd?
Alleen zoeken (en niets kunnen vinden) is niet voldoende.
Ik heb hier op het forum gezocht en gegoogled. Omdat de bewerking "select" is, en het object "select" heet wordt het zoeken er ook niet eenvoudiger op.

Ik heb het vermoeden dat het iets met de selectedIndex te maken heeft, maar kan de juiste code niet vinden..

  • Borizz
  • Registratie: Maart 2005
  • Laatst online: 02-01 15:55
JavaScript:
1
2
3
4
5
6
var options = document.getElementById('selectId').options[];
for (var i=0; i < options.length; i++) {
  if (options[i].value == '3' || options[i].value == '2') {
    options[i].selected = true;
  } 
}

If I can't fix it, it ain't broken.


Verwijderd

Hoe weet je welke je moet selecteren.

Ik neem aan dat je ergens opslaat in een database wat de keuze moet zijn.
Dan kun je toch dynamisch dat laten genereren met php of iets dergelijks?

  • Annie
  • Registratie: Juni 1999
  • Laatst online: 25-11-2021

Annie

amateur megalomaan

Als het "onload" moet plaatsvinden, waarom dan niet gewoon:
HTML:
1
2
3
...
<option selected="selected">nummer 2</option>
...

Today's subliminal thought is:


  • .Alex
  • Registratie: Augustus 2005
  • Laatst online: 01-08-2022
Borizz schreef op woensdag 28 juni 2006 @ 18:20:
JavaScript:
1
2
3
4
5
6
var options = document.getElementById('selectId').options[];
for (var i=0; i < options.length; i++) {
  if (options[i].value == '3' || options[i].value == '2') {
    options[i].selected = true;
  } 
}
Hmm.. met die code kan ik 123 niet echt wat. Dit zou mede wel eens kunnen komen omdat ik een syntax error krijg. Reden hiervan kan natuurlijk zijn dat de code niet goed is, of ik het niet snap. ;)
Verwijderd schreef op woensdag 28 juni 2006 @ 18:21:
Hoe weet je welke je moet selecteren.

Ik neem aan dat je ergens opslaat in een database wat de keuze moet zijn.
Dan kun je toch dynamisch dat laten genereren met php of iets dergelijks?
True, maar met javascript zou het handiger en sneller moeten kunnen. Ik probeer hier stiekem ook iets van te leren. Met php kan ik het prima oplossen, maar dat wil ik niet :9
Annie schreef op woensdag 28 juni 2006 @ 19:56:
Als het "onload" moet plaatsvinden, waarom dan niet gewoon:
HTML:
1
2
3
...
<option selected="selected">nummer 2</option>
...
Zie hierboven, het is dynamisch.

Iemand anders nog leuke suggesties?

[ Voor 5% gewijzigd door .Alex op 29-06-2006 01:14 ]


Verwijderd

Met de code van Boris moet je toch een heel eind komen...
Als je verder hulp wilt, zal je toch met wat eigen code in combi met de code van Boris moeten komen.
Meld erbij wat voor error je krijgt en misschien kunnen we je verder helpen ;)

  • Michali
  • Registratie: Juli 2002
  • Laatst online: 09-12-2025
Borizz schreef op woensdag 28 juni 2006 @ 18:20:
JavaScript:
1
2
3
4
5
6
var options = document.getElementById('selectId').options[];
for (var i=0; i < options.length; i++) {
  if (options[i].value == '3' || options[i].value == '2') {
    options[i].selected = true;
  } 
}
Die [] achter options moet weg. Dan zou het wel moeten werken.

Noushka's Magnificent Dream | Unity


  • .Alex
  • Registratie: Augustus 2005
  • Laatst online: 01-08-2022
Michali schreef op donderdag 29 juni 2006 @ 08:35:
[...]

Die [] achter options moet weg. Dan zou het wel moeten werken.
Potverdrie! Ik kon de fout maar niet vinden, maar het zat gewoon in die blokhaken. :(

Om de oplossing (voor mij) volledig te maken: (leuk voor de archieven)

code:
1
2
3
4
5
6
7
8
function selectboxdoen(waarde){
    var options = document.getElementById('naamvandeselectbox').options; 
    for (var i=0; i < options.length; i++) { 
      if (options[i].value == waarde) { 
        options[i].selected = true; 
      }  
    }
}


Iedereen bedankt!

[ Voor 4% gewijzigd door .Alex op 29-06-2006 12:51 ]


  • crisp
  • Registratie: Februari 2000
  • Laatst online: 18:49

crisp

Devver

Pixelated

Ik zou ook een break doen als je de waarde gevonden hebt, en ipv de optie op selected zetten de selectedIndex van de select gebruiken:
JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
function selectboxdoen(id,waarde)
{
    var select = document.getElementById(id), options = select.options, i = options.length;
    while (i--)
    {
        if (options[i].value == waarde)
        {
            select.selectedIndex = i;
            break;
        }
    }
}

Intentionally left blank


  • .Alex
  • Registratie: Augustus 2005
  • Laatst online: 01-08-2022
crisp schreef op donderdag 29 juni 2006 @ 12:55:
Ik zou ook een break doen als je de waarde gevonden hebt, en ipv de optie op selected zetten de selectedIndex van de select gebruiken:
Even voor het leerproces: Waarom?

  • crisp
  • Registratie: Februari 2000
  • Laatst online: 18:49

crisp

Devver

Pixelated

.Alex schreef op donderdag 29 juni 2006 @ 13:12:
[...]

Even voor het leerproces: Waarom?
Het eerste omdat als je de waarde gevonden hebt het onzinnig is om de rest van de waardes nog te checken, en het tweede omdat gebruik van selectedIndex betere support geniet in oudere browsers :)

Intentionally left blank


  • Sybr_E-N
  • Registratie: December 2001
  • Laatst online: 15-02 20:01
.Alex schreef op donderdag 29 juni 2006 @ 13:12:
[...]

Even voor het leerproces: Waarom?
Waarom zou je daargaan met zoeken als je de waarden al gevonden hebt?

[ Voor 53% gewijzigd door Sybr_E-N op 29-06-2006 13:14 ]


  • .Alex
  • Registratie: Augustus 2005
  • Laatst online: 01-08-2022
crisp schreef op donderdag 29 juni 2006 @ 13:13:
[...]

Het eerste omdat als je de waarde gevonden hebt het onzinnig is om de rest van de waardes nog te checken, en het tweede omdat gebruik van selectedIndex betere support geniet in oudere browsers :)
Okay, gaaf!
En als ik goed heb begint ie nu onderaan ipv bovenaan de seletbox te controleren toch?

Ik wordt steeds meer overdonderd door handige mogelijkheden van Javascript 8)

  • Tsjilp
  • Registratie: November 2002
  • Niet online

Tsjilp

RS[I]ds

.Alex schreef op donderdag 29 juni 2006 @ 13:31:
[...]

Okay, gaaf!
En als ik goed heb begint ie nu onderaan ipv bovenaan de seletbox te controleren toch?

Ik wordt steeds meer overdonderd door handige mogelijkheden van Javascript 8)
Ja hij begint onderaan, JS kan (evenals actionscript) sneller aftrekken dan optellen.
Wil je toch dat hij optelt dat is de snelste manier i-(-1) (tenminste in AS, neem aan dat dat ook voor JS geldt)

Raar... Is zo gek nog niet


  • crisp
  • Registratie: Februari 2000
  • Laatst online: 18:49

crisp

Devver

Pixelated

Tsjilp schreef op donderdag 29 juni 2006 @ 14:17:
[...]


Ja hij begint onderaan, JS kan (evenals actionscript) sneller aftrekken dan optellen.
Wil je toch dat hij optelt dat is de snelste manier i-(-1) (tenminste in AS, neem aan dat dat ook voor JS geldt)
Dit is nog sneller (en voorwaards):
JavaScript:
1
2
3
4
5
var i = 0, option;
while ((option = options[i++]))
{
  // do iets met option
}

fact is dat ik gewoon een voorkeur heb voor while() tov for(;;) ;)

Het is overigens niet het optellen/aftrekken dat het verschilt maakt, maar de evaluatie naar true/sfalse is sneller dan een vergelijking met een integer ;)

[ Voor 15% gewijzigd door crisp op 29-06-2006 14:21 ]

Intentionally left blank

Pagina: 1