Change Select Field on Text input value change
HTML
<form>
<input name="input_12" id="input_1_20" type="text" value="" class="medium">
<select name="input_15" id="input_1_15">
<option value="0-100 beds|10" price="">0-100 beds </option>
<option value="101-250 beds|7.5" price=" -£ 2.50">101-250 -£ 2.50</option>
<option value="251-500 beds|5" price=" -£ 5.00">251-500 -£ 5.00</option>
<option value="501+ beds|2500" price=" +£ 2,490.00">501+ beds +£ 2,490.00</option>
</select>
</form>
JavaScript
function setSelectedValue(selectObj, valueToSet) {
for (var i = 0; i < selectObj.options.length; i++) {
if (selectObj.options[i].text== valueToSet) {
selectObj.options[i].selected = true;
return;
}; }
}
$('#input_1_20').change(function() {
var selectObj = document.getElementById('input_1_15');
var bedNumber = parseInt(document.getElementById('input_1_20').value);
if (bedNumber <= 100) {
setSelectedValue(selectObj,"0-100 beds|10"); }
else if (bedNumber <= 250) {
setSelectedValue(selectObj, "101-250 beds|7.5"); }
else if (bedNumber <= 500) {
setSelectedValue(selectObj, "251-500 beds|5"); }
else { setSelectedValue(selectObj, "500+ beds|2500"); }
});