我是淘汰赛的新手。我想在我的 ASP.NET MVC 项目中使用它。但我不明白如何从服务器显示验证错误。
例如,我们有一个带有登录名和密码输入的身份验证表单。我可以在客户端进行必需或长度验证。但是当我向服务器提交表单但未找到提交登录的用户或密码不正确时,我该怎么办?如何使用knockout.js 显示服务器验证错误?
更新 1
以控制器代码为例,它会返回字典:项目键,错误信息
[HttpPost]
public ActionResult MyAction(MyModel model)
{
if(ModelState.IsValid)
{
...
}
var errorList = ModelState.ToDictionary(
kvp => kvp.Key,
kvp => kvp.Value.Errors.Select(e => e.ErrorMessage).ToArray());
return Json(errorList);
}
向您的视图模型添加一个表示错误消息的属性,并使其可观察。然后执行 ajax 请求以对用户进行身份验证,完成后您应该得到 JSON 格式的结果,并将其放入该 observable 中。您还可以添加另一个属性来指示请求是否成功,并使用它来显示错误消息。
该模型可能如下所示:
var model = {
... // your current properties
errorMsg : ko.observable(""),
isError: ko.observable(false)
}
需要时使用visible
绑定isError
显示错误消息。
在以下示例中,您将errors
随 AJAX 结果一起获取对象并将其传递给setErrors
方法。的每个成员errors
对应于表单域。错误消息仅在定义属性时可见。
var model = {
errors: {
user: ko.observable(),
email: ko.observable()
},
setErrors: function(errors) {
this.errors.user(errors.user);
this.errors.email(errors.email);
}
};
ko.applyBindings(model);
// Get the results from AJAX and pass them as params:
var ajaxResults = {
errors: {
user: "Username is not available",
email: "Incorrect email address"
}
};
model.setErrors(ajaxResults.errors);
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<form>
<input type="text" name="user">
<span data-bind="visible: errors.user, text: errors.user"></span>
<br>
<input type="text" name="email">
<span data-bind="visible: errors.email, text: errors.email"></span>
</form>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句