php - Form input value based on option value selected

Question

for the following form

<form action ='search.php' method = 'post'>

<select name="filter">
<option id="A" value="A">A</option>
<option id="B" value="B">B</option>
</select>

<input type ='text' name="key" id ="field" value ="something that changes based on what option is selected" />

<input type ='submit' value = 'Search' />

</form>

How do i make the value of the input field change based on whether A or B is selected? I assume it has to be done in javascript. I have used jquery here and there so it is ok to make suggestions based on it. Thanks alot!

Answer 1

You don't have to use jQuery, (but jQuery does makes life easier):

HTML:

<form action ='search.php' method = 'post'>
    <select id="filter" name="filter">
    <option id="A" value="A">A</option>
    <option id="B" value="B">B</option>
    </select>

    <input type ='text' name="key" id ="field" value ="something that changes based on what option is selected" />

    <input type ='submit' value = 'Search' />    
</form>

Javascript:

document.getElementById('filter').onchange = function () {
    document.getElementById('field').value = event.target.value  
}

Example