En mi página tengo un campo de tipo select que habilita un input cuando el valor de la primera es distinto a 0.
Estos son mis campos:
<div class="form-group">
<label for="calidad">Calidad material (baja/media/alta):</label><br>
<select name="calidad_select" id="calidad_select">
<option value="0">Selecciona...</option>
<option value="1">Baja</option>
<option value="2">Media</option>
<option value="3">Alta</option>
</select>
<input class="form-control" type="number" step="any" name="calidadmaterial" id="calidadmaterial" disabled/>
</div>
El código JQuery/Javascript que regula el comportamiento de la select es el siguiente:
$(function() {
$("#calidad_select").change(function() {
if ($(this).val() !== "0") {
$("#calidadmaterial").prop("disabled", false);
} else {
$("#calidadmaterial").prop("disabled", true);
$("#calidadmaterial").change(function() {
var valorSelect = $("#calidadmaterial").val()
if (valorSelect > 0 && valorSelect < 6000){
$("#calidad_select").val(1).change();
} else if (valorSelect > 6000 && valorSelect < 16000){
$("#calidad_select").val(2).change();
} else {
$("#calidad_select").val(3).change();
}
});
}
});
});
Mi idea es que cuando el usuario escriba en el input, el value de la select cambie, es decir que si un valor que le pase al input el usuario es menor a 6000 que value cambie a 2, si es mayor a 6000 y menor a 16000 que cambie a 1, si es mayor de 16000 que cambie a 3, ¿cómo podría mejorar este código para que esto pueda funcionar en mi página?