How can I change the the selected attribute on clicking buttons in pure js?

Question

these is my first post, so please be patient :)

HTML:

<input type="button" class="btn-value1" value="Value1">
<input type="button" class="btn-value2" value="Value2">
<input type="button" class="btn-value3" value="Value3">

<select id="testSelect>
    <option id="id0" value="value0" selected>None</option> 
    <option id="id1" value="value1">Value1</option>
    <option id="id2" value="value2">Value2</option>
    <option id="id3" value="value3">Value3</option>      
</select>

Now i want to change the selected status when clicking on a button on a professional way. How can i do this with JavaScript?

Many thans in advantage! Keek

There are many question like this: [on-click-get-button-value](https://stackoverflow.com/questions/16756048/on-click-get-button-value), how to change a select value from javascript: https://stackoverflow.com/questions/9490906/how-to-change-a-select-value-from-javascript — barbsan, Feb 21 '19 at 11:57

score 0 · Answer 1 · answered Feb 21 '19 at 11:54

Try this

function a(e)
{
var a=e.split('-')[1];
document.querySelector('select').value=a;
}

<input type="button" class="btn-value1" value="Value1" onclick="a(this.className)">
<input type="button" class="btn-value2" value="Value2" onclick="a(this.className)">
<input type="button" class="btn-value3" value="Value3" onclick="a(this.className)">

<select id="testSelect">
    <option id="id0" value="value0" selected>None</option> 
    <option id="id1" value="value1">Value1</option>
    <option id="id2" value="value2">Value2</option>
    <option id="id3" value="value3">Value3</option>      
</select>

How can I change the the selected attribute on clicking buttons in pure js?

1 Answers1