I have a view page with model validations and client side validation enabled. I have a submit button which on click I have called a javascript function which uses jQuery for an AJAX call to the server..but I want to stop the AJAX action when client side validations fails. Any idea how to?
我有一个带有模型验证和客户端验证的视图页面。我有一个提交按钮,点击时我调用了一个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>
Here is my JavaScript:
这是我的JavaScript:
function SaveBulletin() {
tinyMCE.triggerSave();
$.ajax({
type: 'POST',
url: "FacilityBulletin/FacilityBulletin/SaveBulletin",
data: $("form.hiajax").serialize(),
success: function (data) { alert(data); }
});
}
Please help.
请帮助。
2 个解决方案
#1
1
Instead of having an onclick
attribute on your your image submit button use the .submit()
action of the form:
不要在您的图像提交按钮上使用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;
});
});
Also notice how the url is no longer hardcoded in javascript but read from the action
attribute of the form. Of course you need to fix your Html.BeginForm
as well in order to supply the proper controller and action the form has to be sent to.
还要注意url如何不再用javascript硬编码,而是从表单的action属性中读取。当然,您需要修复Html。BeginForm还为了提供适当的控制器和表单必须发送到的操作。
#2
0
While not specifically geared towards MVC, you can manually call and check client-side validation though javascript, as follows:
虽然不是专门针对MVC,但您可以通过javascript手动调用和检查客户端验证,如下所示:
function SaveBulletin()
{
Page_ClientValidate();
if (Page_IsValid)
{
// do Ajax call
}
}
#1
1
Instead of having an onclick
attribute on your your image submit button use the .submit()
action of the form:
不要在您的图像提交按钮上使用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;
});
});
Also notice how the url is no longer hardcoded in javascript but read from the action
attribute of the form. Of course you need to fix your Html.BeginForm
as well in order to supply the proper controller and action the form has to be sent to.
还要注意url如何不再用javascript硬编码,而是从表单的action属性中读取。当然,您需要修复Html。BeginForm还为了提供适当的控制器和表单必须发送到的操作。
#2
0
While not specifically geared towards MVC, you can manually call and check client-side validation though javascript, as follows:
虽然不是专门针对MVC,但您可以通过javascript手动调用和检查客户端验证,如下所示:
function SaveBulletin()
{
Page_ClientValidate();
if (Page_IsValid)
{
// do Ajax call
}
}