[JS] Select onChange()

[Verwijderd]

Hallo mensen,

Ik heb deze select met onChange een javascript functie. Die functie doet er nu niet toe. de parameter wel.

Dit is nu namelijk this.selectedIndex.
Die geeft bij de eerste: 0, tweede: 1 enz.

Maar ik wil graag dat hij de waarden neemt uit de <option value="">
Heeft iemand enig idee hoe ik dat kan bereiken?
(ik dacht aan iets van this.selectedValue maar dat werkt niet).

HTML:

<select name="category" onChange="processcat(this.selectedIndex)" >
         <option value="1">cat 1</option>
         <option value="2">cat 2</option>
          <option value="3">cat 3</option>
 </select>

[XWB]

JavaScript:

onchange="processcat ( this.value )"

[Verwijderd]

Verwijderd schreef op zondag 17 december 2006 @ 17:08:
Hallo mensen,

Ik heb deze select met onChange een javascript functie. Die functie doet er nu niet toe. de parameter wel.

Dit is nu namelijk this.selectedIndex.
Die geeft bij de eerste: 0, tweede: 1 enz.

Maar ik wil graag dat hij de waarden neemt uit de <option value="">
Heeft iemand enig idee hoe ik dat kan bereiken?
(ik dacht aan iets van this.selectedValue maar dat werkt niet).

code:

<select name="category" onChange="processcat(this.selectedIndex)" >
         <option value="1">cat 1</option>
         <option value="2">cat 2</option>
          <option value="3">cat 3</option>
 </select>

Was het niet zoiets als:

code:

document.(hier je form naam).category[this.selectedIndex].value

of korter:

code:

this.value

offtopic:
Hacku was me voor./

[ Voor 4% gewijzigd door Verwijderd op 17-12-2006 17:13 ]

[Verwijderd]

Dát was het! Bedankt!

[gvanh]

Even een kleine aanvullende vraag hierop ... if possible?

De onchange handler wordt bij form elementen pas aangeroepen wanneer het gewijzigde element de focus verliest. Bij <select> elementen vind ik het daarentegen wel handig als direct bij het aanklikken van de nieuwe waarde de onchange wordt aangeroepen. Is er een handige manier om dat voor elkaar te krijgen, zonder dat je direct de werking van de selectbox danig verstoort?

[Crayne]

gvanh schreef op maandag 18 december 2006 @ 13:17:
De onchange handler wordt bij form elementen pas aangeroepen wanneer het gewijzigde element de focus verliest. Bij <select> elementen vind ik het daarentegen wel handig als direct bij het aanklikken van de nieuwe waarde de onchange wordt aangeroepen. Is er een handige manier om dat voor elkaar te krijgen, zonder dat je direct de werking van de selectbox danig verstoort?

Ik weet niet hoe je daar bij komt, maar je kunt perfect onChange gebruiken om bij het selecteren van een keuze JS uit te laten voeren - zonder dat de selectbox daarvoor zijn focus hoeft te verliezen.

Edit:

JavaScript:

function changeSelect() {

    var selectToChange = document.getElementById("select2");

    selectToChange.style.backgroundColor = "#ffffff";
    selectToChange.disabled = false;

    while(selectToChange.hasChildNodes()) { 

        selectToChange.removeChild(selectToChange.firstChild); 

    }
        
    var newOption = document.createElement("option");
    var newOptionText = document.createTextNode("Kies een optie");
            
    newOption.appendChild(newOptionText);
        
    newOption.setAttribute("value", "");
                
    selectToChange.appendChild(newOption);
        
    choicesArray = new Array("Option 1", "Option 2", "Option 3", "Option 4", "Option 5");

    for (i = 0; i < 5; i++) {
            
        var newOption = document.createElement("option");
        var newOptionText = document.createTextNode(choicesArray[i]);
                
        newOption.appendChild(newOptionText);
                
        selectToChange.appendChild(newOption);
                
    }
            
    return null;

}

HTML:

<form name="test" action="#" method="get">

<table cellpadding="3" cellspacing="2" border="0">

<tr valign=top>
    <td align="right" valign=top>Select 1</td>
    <td>
        <select name="select1" id="select1" size="1" onChange="changeSelect();">
            <option value="">Kies een optie</option>
            <option>Kies deze</option>
            <option>Of deze!</option>
            <option>Deze misschien?</option>
        </select>
    </td>
</tr>

<tr valign=top>
    <td align="right" valign=top>Select 2</td>
    <td>
        <select name="select2" id="select2" size="1" disabled="true" style="background-color: #cccccc;">
            <option value="">DISABLED</option>
        </select>
    </td>
</tr>

</table>

</form>

[ Voor 60% gewijzigd door Crayne op 19-12-2006 12:16 ]

[BtM909]

Hoe bedoel je dat precies? Aangezien browsers wel degelijk het onchange event afvuren na het selecteren van je optie

[gvanh]

Oeps ... ja ... mijn fout.

[Verwijderd]

code:

onchange="window.open(this.options[this.selectedIndex].value,\'_blank\')">

Dit wat je bedoelt?