How can I dynamically disable a save button when a specific value is selected from a dropdown menu? I have tried using CSS (display:none) and jQuery (attr) options but they are not working. Is there another method that I can use?
$(document).ready(function() {
$(document).on("change", "select[id^='dropdown_status']", function() {
var status_value = $(this).val();
if (status_value == '2' || status_value == '3') {
//button disable code
//css code not working
$(.submit).css('display', 'none');
$('.submit').hide();
//jquery code not working
//$(':input[type="submit"]').prop('disabled', true);
//$(":submit").attr("disabled", true);
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="status" id="dropdown_status414938923" size="1" tabindex="-1" title="" style="display: none;">
<option value="1">Apple</option>
<option value="2">Grapees</option>
<option value="3">mango</option>
</select>
<input type="submit" class="submit" name="update" value="Save">