Question

I’ve been trying to figure out how to set a value to a an option in a select type. But no matter how much I try to understand I just can’t (feels ashamed)..

So I was hoping that you guys could help me since you’ve helped me so many times before.. 🙂

Let’s say we have:

<select name="box" id="test">    
<option value='tval'>Content</option>

shouldn’t this next code change the text from ‘Content’ to ‘box’?

function changeContent(form){
form.document.getElementById('test').options['tval'].value = 'box';
}

or am I completely wrong here? I’ve looked up so many different articles but no one could help me understand how to do this..

Thanks guys!

Answer 1

If You need to change the text rather than the value;

function changeContent(){
     document.getElementById('test').options[0].text = 'box';
}

To set both the value and text;

function changeContent(){
     var opt= document.getElementById('test').options[0];
     opt.value =  'box';
     opt.text = 'box';
}