添加禁用提交按钮的 javascript 时，客户端验证消息不显示

Question

我的 MVC 应用程序中有一个带有 2 个下拉字段和一个提交按钮的简单表单。我启用了客户端验证，它工作正常。我现在添加了一个 javascript 来禁用提交按钮，以防止表单被提交两次。由于某种未知原因，当我添加此脚本时，客户端验证消息没有显示。这是我的表格：    @using (Html.BeginForm("Recycle", "GetList", FormMethod.Post, new { id = "myForm" }))    {        <!-- Server list -->        <div>            <span>Site type:&nbsp;</span>            @Html.DropDownListFor(m => m.uInputS, new List<SelectListItem>            {                new SelectListItem {Text = "text", Value = "value" },                new SelectListItem {Text = "text", Value = "value" }            }, "Select site type")            @Html.ValidationMessageFor(m => m.uInputS, "", new { @class = "error" })        </div>        <!-- Application list -->        <br />        <div>            <span>Application:&nbsp;</span>            @Html.DropDownListFor(m => m.uInputA, new SelectList(string.Empty, "Value"))            @Html.ValidationMessageFor(m => m.uInputA, "", new { @class = "error" })        </div>        <br />        <!-- Submit-->        <div>            <input id="Submit1" type="submit" value="Submit" onclick="return FreezeSubmit();" />        </div>    }下面是我用来禁用提交按钮的 jquery。<script> function FreezeSubmit() { var s = $("#uInputS").val(); var a = $("#uInputA").val(); if ((s && a)) {    $('#myForm').submit();    $('#Submit1').prop('disabled', true);    return true; } else {    $('#Submit1').prop('disabled', false);    return false; }}</script>这是我的模型：    public class GetList    {      [Required(ErrorMessage = "Please select site type")]      public string uInputS { get; set; }      [Required(ErrorMessage = "Please select application name")]      public string uInputA { get; set; }    }我对编程很陌生，我无法弄清楚为什么客户端验证消息无法显示，因为我添加了一些 javascript。任何帮助表示赞赏。谢谢！

Answer 1

移除点击进入

<input id="Submit1" type="submit" value="Submit" onclick="return FreezeSubmit();" />

改成

<input id="Submit1" type="submit" value="Submit" />

并且您需要将脚本更改为

<script>

 $(document).ready(function(){

 checkEmpty()

 })

 $('input').change(function() {

     checkEmpty();

 });

 function checkEmpty(){

  var s = $("#uInputS").val();

 var a = $("#uInputA").val();

 if ((s && a)) {

    $('#Submit1').prop('disabled', true);

 }

 else {

    $('#Submit1').prop('disabled', false);

 }

 }

</script>

Answer 2

调用提交处理程序时禁用按钮，请参阅此处的jquery api

  $( "#your_form_id" ).submit(function(event) { // Handler for .submit() called.

     $('#Submit1').prop('disabled', true);

 });