我创建了一个简单的登录表单,我想通过ajax验证。
显示MVC产生的服务器端验证错误的最合适方法是什么?是否将错误转换为JSON结果并删除相应的错误消息?如果没有,那会是什么?
目前我所拥有的是正确发布,但整个表单都会回来。目标只是在没有回发/刷新的情况下在表单上显示服务器端错误。在此先感谢...这是我的代码:
@ModelType UHCO_MVC_Agency.LoginModel
<div class="error-container">@Html.ValidationSummary(True)</div>
<div class="row-fluid">
<div class="span12">
<div id="login-form" class="span6">
@Using Html.BeginForm()
@<fieldset>
<legend>Log in to your account now</legend>
<div class="row-fluid">
<div class="span12">
@Html.LabelFor(Function(m) m.UserName)
@Html.TextBoxFor(Function(m) m.UserName, New With {.class = "span12", .placeholder = "Username"})
@Html.ValidationMessageFor(Function(m) m.UserName)
</div>
</div>
<div class="row-fluid">
<div class="span12">
<label for="Password">Your password</label>
@Html.PasswordFor(Function(m) m.Password, New With {.class = "span12", .placeholder = "Password", .type = "password"})
@Html.ValidationMessageFor(Function(m) m.Password)
</div>
</div>
<div class="row-fluid">
<div class="span12">
<label for="RememberMe" class="checkbox clearfix">
@Html.CheckBoxFor(Function(m) m.RememberMe)
Remember me next time I visit
</label>
</div>
</div>
<button type="submit" class="btn btn-primary input-small" value="submit">Log in</button>
</fieldset>
End Using
</div>
</div>
</div>
<HttpPost()> _
Public Function Login(ByVal model As LoginModel, ByVal Username As String, ByVal Password As String, ByVal returnUrl As String) As ActionResult
Dim res As New LoginResponse()
Try
'login here
If Not String.IsNullOrEmpty(returnUrl) AndAlso Url.IsLocalUrl(returnUrl) Then
res.Status = "Success"
Return RedirectToAction("Welcome", "Account")
End If
Catch ex As Exception
If Not HttpContext.Request.IsAjaxRequest() Then
ModelState.AddModelError("", ExceptionWrapper.Wrap(ex).ExceptionMessage())
Return View("Login", model)
Else
res.Status = "Failed"
res.Errors.Add(ExceptionWrapper.Wrap(ex).ExceptionMessage())
Return Json(res)
End If
End Try
' If we got this far, something failed, redisplay form
Return View(model)
End Function
$("#login-form form").live().submit(function (e) {
e.preventDefault();
alert("ok");
});
答案 0 :(得分:1)
这是解决方案的C#版本。我相信,应该很容易转换为相应的VB.NET版本
使用 JSON 绝对是一种很好的方法。
第一件事。我会更改POST
操作方法来处理我的Ajax请求请求并返回JSON
响应。
要保留我的错误响应,我将创建一个类似
的类public class LoginResponse
{
public string Status { set;get;}
public List<string> Errors { set;get;}
public LoginResponse()
{
Errors=new List<string>();
}
}
在我们的POST
操作方法
[HttpPost]
public ActionResult Login(LoginModel model)
{
if(Request.Ajax)
{
var res=new LoginResponse();
//Do your Validations, If everything is fine send Success JSON
res.Status="Success";
//else, Lets return a JSON with errors
res.Status="Failed";
res.Errors.Add("Email does not exist in Earth and Mars");
res.Errors.Add("Password contain the word black magic");
return Json (res);
}
else
{
//Do the normal Processing for Non Ajax requests here
}
}
因此,如果您想要返回客户端时出现错误,您将以此格式发送JSON
{
"Status": "Failed",
"Errors": [ "Email does not exist", "Passoword is worse" ]
}
如果一切正常,我们将发送像这样的JSON
{
"Status": "Success"
}
现在在我们看来,我们将摆脱Ajax表单并使用Normal表单标记和一些纯jQuery。
@ModelType UHCO_MVC_Agency.LoginModel
@using(Html.BeginForm())
{
//Here your for elements
<input type="submit" id="btnSubmit"/>
}
<script type="text/javascript">
$(function(){
$("#btnSubmit").click(function (e) {
e.preventDefault();
$.post("@Url.Action("Login","User")", $("form").serialize(), function (r) {
if(r.Status=="Success")
{
//Login is success . do whatever you want.
}
else
{
//Lets get the Errors from our JSON
$.each(r.Errors,function(index,item){
//Lets show the error
$("#errorSummary").append(item);
}
}
});
});
</script>
编辑:更改您的js代码,看看会发生什么
$("#login-form form").live('submit', function(e){
e.preventDefault();
//the code
});
答案 1 :(得分:0)
无论如何,我不是VB人,但我认为你需要做的是:
1)在您的控制器中,您需要检查并查看您是否通过AJAX到达。您可以发送额外的信息以及数据来表明这一点,或者使用SERVER['HTTP_X_REQUESTED_WITH']
并检查由大多数常见库发送的XMLHTTPRequest。
2)如果页面实际上是通过AJAX请求的,那么在打包输出时你可以采取不同的过程。只返回JSON,然后在操作DOM的客户端解析它。