John
John

Reputation: 451

Grey out Submit button not working on page load

I want the Submit button greyed out on a page load, until the user chooses a certain value other than the default "Choose". Right now it's only disabling the button if the user changes the value and changes it back to "Choose". Shouldn't it be inactive on a page load? The change() jquery method should be called on every page load right?

 $(".Field").change();

  $(".Field").change(function () {
            if ($("#ID option:selected").text() == 'Choose') {
                $("#submitButton").attr("disabled", "disabled");
            }
            else {
                $("#submitButton").attr("enabled", null);
            }
        });



  <div class="Field">
   @Html.DropDownListFor(x => x.ID, new SelectList(Model.Fields, "ID", "About"), "Choose")
 <.div>


     <div class="submitButton">
         <input name="submitButton" type="submit" id="submitButton" value="Submit" />
     </div>
  

Upvotes: 0

Views: 624

Answers (1)

Rohit Utekar
Rohit Utekar

Reputation: 848

Move event trigger below the handler and try.

$(".Field").change(function () {
    if ($("#ID option:selected").text() == 'Choose') {
        $("#submitButton").prop("disabled", "disabled");
    }
    else {
        $("#submitButton").prop('disabled', false);
    }
});

$(".Field").change();

Upvotes: 1

Related Questions