user2320476 user2320476 - 6 months ago 20
Javascript Question

Disable a button based on default values for two dropdownlist

I have two dropdownlist and a disabled button. On load of the page, the button is disabled.
Once either of the dropdown is selected the button is enabled.

I want a situation where if the defaults of the two dropdownlist is
"select a branch" and "select a city", the submit button is disabled.

Is this possible? Is there a function in jquery that can do this. More of a watcher.

@Html.DropDownList("ddlrt", Model.Yoma, "Select a branch", new { @class = "kel" })
@Html.DropDownList("ddlre", Model.Kuma, "Select a City", new { @class = "kel" })
<button id="mySubmit" class="btnyoma" disabled>Submit</button>
<script>
//Other Items can go here
$("#ddlrt").change(function () {
$('.sendbtn').removeAttr("disabled");
});

//other items can end here
$("#ddlre").change(function () {
$('.sendbtn').removeAttr("disabled");
});
</script>

Answer

You can do it like following.

$("#ddlrt, #ddlre").change(function () {
    if ($('#ddlrt').val() || $('#ddlre').val())
        $('.sendbtn').prop("disabled", false);
    else
        $('.sendbtn').prop("disabled", true);
});
Comments