Предотвратите jQuery-вызов на стороне сервера, если в ASP.NET MVC происходит сбой проверки на стороне клиента

Question

У меня есть страница просмотра с включенными проверками моделей и проверкой на стороне клиента.У меня есть кнопка отправки, которую я нажал, когда вызвал функцию javascript, которая использует jQuery для вызова AJAX на сервере. Но я хочу остановить действие AJAX, когда проверка на стороне клиента не проходит.Любая идея, как?

<% Html.EnableClientValidation(); %>
<% using (Html.BeginForm("", "", FormMethod.Post, new { @class = "hiajax" }))
   {%>
<%= Html.ValidationSummary(true) %>
<div class="formRow">
<%if(Model.ListFacility.Count !=0){ %>
    <%= Html.LabelFor(model => model.ListFacility)%><span class="err">*</span><br />
    <%= Html.DropDownListFor(model => model.ListFacility, (SelectList)ViewData["FacilityBulletin"], new {onChange="updateSiteId()" })%>
   <span class="err"> <%= Html.ValidationMessageFor(model => model.ListFacility) %></span>
    <div class="clear">
</div>
<%} %>
<div class="formRow">
    <%= Html.LabelFor(model => model.FacilityBulletin) %><span class="err">*</span><br />
    <%= Html.TextAreaFor(model => model.FacilityBulletin,  new { @class = "tinymce" })%>
   <span class="err">   <%= Html.ValidationMessageFor(model => model.FacilityBulletin) %></span>
    <div class="clear" />
</div>
<div class="formRow">

        <%=Html.CheckBoxFor(model=>model.Active, new { style = "float: left; margin-right: 10px;" })%>
    <span style="float: left; padding-top: 1px;">Active</span>
    <%=Html.HiddenFor(model=>model.SiteId) %>
</div>
<div class="formRow">       
    <input type="image" name="Save" src='<% =Url.Content("~/images/btn_save.png") %>'  onclick="SaveBulletin();" />
</div>
<% } %>
</div>

Вот мой JavaScript:

function SaveBulletin() {
    tinyMCE.triggerSave();
    $.ajax({
        type: 'POST',
        url: "FacilityBulletin/FacilityBulletin/SaveBulletin",
        data: $("form.hiajax").serialize(),
        success: function (data) { alert(data); }
    });
}

Пожалуйста, помогите.

Answer 1

Вместо наличия атрибута onclick на кнопке отправки изображения используйте действие .submit() в форме:

$(function() {
    $('form.hiajax').submit(function() {
        tinyMCE.triggerSave();
        $.ajax({
            type: this.method,
            url: this.action,
            data: $(this).serialize(),
            success: function (data) { alert(data); }
        });        
        return false;
    });
});

Также обратите внимание, что URL больше не являетсяжестко закодирован в javascript, но читается из атрибута action формы.Конечно, вам также нужно исправить свой Html.BeginForm, чтобы обеспечить надлежащий контроллер и действие, на которое должна быть отправлена ​​форма.

Answer 2

Хотя это и не предназначено специально для MVC, вы можете вручную вызвать и проверить клиентскую проверку с помощью javascript следующим образом:

function SaveBulletin() 
{
    Page_ClientValidate();

    if (Page_IsValid) 
    {
            // do Ajax call
    }
}