这几乎要了我的命。我从来没有在一个问题上浪费过这么多时间。我有一个需要通过调用 REST API 来验证的字段,因为它需要检查数据库中是否存在某些数据。我遇到的问题是,即使调用 json api 返回 false,调用 validator.validate 也会返回 true。
这是代码(我使用 Kendo MVC 助手,但与问题无关)
<div id="divValidator1">
<div class="form-group">
@Html.LabelFor(m => m.Email)
@(Html.Kendo().TextBoxFor(m => m.Email)
.HtmlAttributes(new { placeholder = "you@domain.com", type = "email", @class = "k-textbox required",data_bind="value: XXX" })
)
</div>
<footer class="col-xs-12 form-group text-right">
@(Html.Kendo().Button()
.Name("Next1")
.Content("Next")
.HtmlAttributes(new { @class = "k-primary", data_bind = "enabled: isEnabled" })
.Events(ev => ev.Click("onNextClick")))
</footer>
var kendoValid = $("#divValidator1").kendoValidator({
validateOnBlur: false,
rules: {
remote: function (input) {
if (input.val() == "" || !input.attr("data-val-remote-url")) {
return true;
}
if (input.attr("data-val-remote-recieved")) {
input.attr("data-val-remote-recieved", "");
return !(input.attr("data-val-remote"));
}
var url = input.attr("data-val-remote-url");
var postData = {};
postData[input.attr("data-val-remote-additionalfields").split(".")[1]] = input.val();
var validator = this;
var currentInput = input;
input.attr("data-val-remote-requested", true);
$.ajax({
url: url,
type: "POST",
data: JSON.stringify(postData),
dataType: "json",
traditional: true,
async:false,
contentType: "application/json; charset=utf-8",
success: function (data) {
if (data == true) {
input.attr("data-val-remote", "");
}
else {
input.attr("data-val-remote", false);
}
input.attr("data-val-remote-recieved", true);
// validator.validateInput(currentInput);
},
error: function () {
input.attr("data-val-remote-recieved", true);
validator.validateInput(currentInput);
}
});
return true;
}
},
messages: {
remote: function (input) {
return input.attr("data-val-remote");
}
}
}).data("kendoValidator");
var viewModel1 = kendo.observable({
XXX:null,
isEnabled: function () {
var self = this;
self.get("XXX");
var x = $("#divValidator1").data("kendoValidator");
console.log(x.validate());
}
});
kendo.bind($("#divValidator1"), viewModel1);
这是控制器
public ActionResult IsEmailJustPresent(string email)
{
var res = email == "something";
return Json(res, JsonRequestBehavior.AllowGet);
}
和 ViewModel
public class RegisterViewModel
{
[Required]
[EmailAddress]
[Display(Name = "Email")]
[Remote("IsEmailJustPresent", "Home")]
public string Email { get; set; }
}
我还使用了 kendo.observable,以便我可以根据验证值启用/禁用下一个按钮。
在 isEnabled 函数中你看到我做 var x = $("#divValidator1").data("kendoValidator"); 但它总是返回真(似乎只检查所需的属性)。
为了达到那个解决方案,我从这里开始
如果你想要我在git上创建的更复杂的示例,其中包括我在最终项目中需要的向导