[Javascript] value van een select

[Millshot2]

Beste Tweakers,

Ik heb een hele simpele functie die een input veldje in een formulier van waarde moet voorzien, op het moment dat er iets wijzigt in een select option.

De code

JavaScript: filename

 
<script type="text/javascript">
    function projectnummer()
    {
    var mylist=document.getElementById("StoringNaamMelder")
    document.getElementById("favorite").value=mylist.options[mylist.selectedIndex].text
    }
</script>

<select id="StoringNaamMelder" onchange="projectnummer()" name="StoringNaamMelder">
   <option value="1">Storingen Gemert-Bakel</option>
   <option value="2">Storingen Cranendonck</option> 
   <option value="overig">Overige</option>
</select>

<input type="text" id="favorite" size="20">

Op het moment dat ik een storing kies in de lijst, komt de naam van de storing te staan in de input met de id "favorite". Maar ik wil niet de waarde tussen de option tags, maar de value daarvan hebben.

Nu zou je zeggen : var mylist=document.getElementById("StoringNaamMelder").value ,
maar dat werkt dus niet.
Zit al 2 uurtjes te zoeken, maar nergens heb ik nog een oplossing gevonden die werkt, en dan ook nog eens werkt in zowel FF als IE.

Ik hoop dat hier iemand een oplossing heeft.

Mvg,

Geoffrey

[NMe]

Nog steeds in het foute subforum. Waar hoort mijn topic?

PRG>>WEB

[crisp]

Betere poging maar nog steeds verkeerde forum

--> Webdesign, Markup & Clientside Scripting

dat was dus een dubbele move

[ Voor 18% gewijzigd door crisp op 20-09-2006 11:57 ]

[BtM909]

Als je nou in je onchange handler meteen de value meegeeft, dan kan je het volgende doen (wat veel overzichtelijker is:

HTML:

<script type="text/javascript">
    function projectnummer(elValue)
    {
        document.getElementById("favorite").value = elValue;
    }
</script>

<select id="StoringNaamMelder" onchange="projectnummer(this.value)" name="StoringNaamMelder">
   <option value="1">Storingen Gemert-Bakel</option>
   <option value="2">Storingen Cranendonck</option>    
   <option value="overig">Overige</option>
</select>

<input type="text" id="favorite" size="20">

---

En serieus... Je mag blij zijn dat ik je op weg help, want dit is in iedere reference op te zoeken...

[ Voor 9% gewijzigd door BtM909 op 20-09-2006 11:58 ]

[André]

Millshot2 schreef op woensdag 20 september 2006 @ 11:55:

JavaScript:

 
<script type="text/javascript">
    function projectnummer()
    {
    var mylist=document.getElementById("StoringNaamMelder")
    document.getElementById("favorite").value=mylist.options[mylist.selectedIndex].text
    }
</script>

Maar ik wil niet de waarde tussen de option tags, maar de value daarvan hebben.

Gebruik dan geen .text maar .value

[ Voor 86% gewijzigd door André op 20-09-2006 11:59 ]

[Millshot2]

Mijn excuses mensen.

Ik wilde een enter geven voor een volgende regel, maar het formulier werd gesubmit.
Toen ik het bericht aan wilde passen, was het verplaatst. Mijn fout.
Ik was het topic alleen kwijt en plaatste het opnieuw fout.

[crisp]

en je kan eenvoudig een referentie naar je select meegeven aan de functie dmv het 'this' keyword:

HTML:

<script type="text/javascript">
    function projectnummer(mylist)
    {
    document.getElementById("favorite").value=mylist.options[mylist.selectedIndex].value;
    }
</script>

<select onchange="projectnummer(this)" name="StoringNaamMelder">
   <option value="1">Storingen Gemert-Bakel</option>
   <option value="2">Storingen Cranendonck</option>    
   <option value="overig">Overige</option>
</select>

<input type="text" id="favorite" size="20">

[Millshot2]

Bedankt BtM909,

Je oplossing werkt en hij is idd nog veel mooier ook.

Javascript is niet m'n beste kant, maar ik kan weer vooruit.

Bedankt voor jullie snelle hulp. Hij kan dicht.

[ Voor 4% gewijzigd door Millshot2 op 20-09-2006 12:01 ]

[Millshot2]

crisp schreef op woensdag 20 september 2006 @ 12:00:
en je kan eenvoudig een referentie naar je select meegeven aan de functie dmv het 'this' keyword:

HTML:

<script type="text/javascript">
    function projectnummer(mylist)
    {
    document.getElementById("favorite").value=mylist.options[mylist.selectedIndex].value;
    }
</script>

<select onchange="projectnummer(this)" name="StoringNaamMelder">
   <option value="1">Storingen Gemert-Bakel</option>
   <option value="2">Storingen Cranendonck</option>    
   <option value="overig">Overige</option>
</select>

<input type="text" id="favorite" size="20">

En wat zijn daar de voordelen van tov de oplossing van BtM909 ?
Weet weinig van Javascript.

[BtM909]

Voordeel van de optie van crisp is dat mocht je in de toekomst iets anders willen dan de value of misschien wel meer eigenschappen, dat je alleen het object meegeeft ipv direct een attribuut.

Stel dat je wat wil doen met de text en de value, dan is mijn oplossing al niet meer toereikend.

[crisp]

Tsja, of je nou een value meegeeft aan de functie of een referentie naar je select en daar in je functie de value uithaalt maakt op zich niet zoveel uit. Feit is echter wel dat oudere browsers vaak niet de value-property van de select zelf bijwerken en het via de options mbv selectedIndex opzoeken van de value meer compatible is.
De text-property is echter enkel via de options-collection uit te vragen, dus dan is mijn methode in principe flexibeler

[ Voor 15% gewijzigd door crisp op 20-09-2006 12:08 ]

[Millshot2]

Bedankt voor jullie hulp.

het werkt, en het is me nog duidelijk ook.
Nog een fijne dag.