如果表單無效，則禁用模式彈出框

我有一個MVC 5表單，通過jQuery提交併將表單提交給控制器上的HTTPPost方法。這一切工作正常，但我需要它來驗證表單。現在，它將顯示帶有控件的頁面上的驗證摘要，但屏幕疊加顯示，但不顯示彈出窗口。所以我認爲它的中途工作。我只是不希望它覆蓋屏幕，我不希望彈出窗口顯示，如果表單無效。我怎樣才能做到這一點？如果表單無效，則禁用模式彈出框

形式CSHTML

@using (Html.BeginForm("Index", "Home", FormMethod.Post, new { id = "ballotForm" })) 
{ 
    @Html.AntiForgeryToken() 

    @Html.EditorFor(m => m.BallotViewModel, new ViewDataDictionary(ViewData) { TemplateInfo = new TemplateInfo { HtmlFieldPrefix = "BallotViewModel" } }) 

    <table class="col-sm-12"> 
     <tr> 
      <td> 

       <button type="submit" class="btn btn-default btn-md btn-submit" data-target="#modal-container" data-toggle="modal"> 
        <span class="glyphicon glyphicon-send" aria-hidden="true"></span> Submit 
       </button> 

      </td> 
     </tr> 
    </table> 
}

jQuery的

$(function() { 
    $('#ballotForm').on('submit', function (e) { 
     var isValid = $('#ballotForm').valid(); 
     console.log(isValid); 
     if (isValid) 
     { 

     e.preventDefault(); 

     var data = $(this).serialize(); 
     var url = $(this).attr('target'); 

     $.post(url, data) 
      .done(function (response, status, jqxhr) { 

       $('#modal-container').on('show.bs.modal', function (event) { 
        var modal = $(this); 
        console.log(modal); 
        modal.find('.modal-content').html(response); 
        console.log(response); 
       }); 
       $('#modal-container').modal('show'); 

      }) 
      .fail(function (jqxhr, status, error) { }); 
     } 

    }); 
});

來源

2015-10-05 JMO

我已經使用以下庫來完成bootstrap驗證。 https://github.com/johnnyreilly/jQuery.Validation.Unobtrusive.Native – Marko

這對我不起作用 – JMO

我能得到這個通過添加上述我當前的jquery下面的代碼片斷工作。

$(function() { 
    $("#btnBallotFormSubmit").click(function() { 
     var ValidStatus = $("#ballotForm").valid(); 
     console.log(ValidStatus); 
    if (ValidStatus == false) { 
     return false; 
    } 
}); 
});

來源

2015-10-05 20:03:53 JMO

如果表單無效，則禁用模式彈出框

回答

相關問題