Remote validation for kendowindow - asp.net-mvc

Question

I implement remote validation. It works for usual fields correctly, but if field is situated in kendowindow jquery validation does not work.
How can I solve this problem?

Answer 1

This can be achieved using Kendo UI validator as demonstrated below:
Model with "Remote" annotation attribute:
public class ProductViewModel
{
[Editable(false)]
public int ProductID { get; set; }
[Required]
[Remote("UniqueName", "Home", ErrorMessage = "The entered name already exists.")]
public string ProductName { get; set; }
}
Controller with "UniqueName" Action:
public ActionResult UniqueName(string productName)
{
var context = new NorthwindEntities();
return Json(!context.Products.Any(p => p.ProductName == productName), JsonRequestBehavior.AllowGet);
}
Script to add custom validation rule to the Kendo UI validation rules for the "Remote" validation attribute (can be placed anywhere on the page before Grid initialization code):
<script>
(function ($, kendo) {
$.extend(true, kendo.ui.validator, {
rules: {
//define custom validation rule to match remote validation:
mvcremotevalidation: function (input) {
if (input.is("[data-val-remote]") && input.val() != "") {
var remoteURL = input.attr("data-val-remote-url");
var valid;
$.ajax({
async: false,
url: remoteURL,
type: "GET",
dataType: "json",
data: validationData(input, this.element),
success: function (result) {
valid = result;
},
error: function () {
valid = false;
}
});
return valid;
}
return true;
}
},
messages: {
mvcremotevalidation: function (input) {
return input.attr("data-val-remote");
}
}
});
function validationData(input, context) {
var fields = input.attr("data-val-remote-additionalFields").split(",");
var name = input.prop("name");
var prefix = name.substr(0, name.lastIndexOf(".") + 1);
var fieldName;
var data = {};
for (var i = 0; i < fields.length; i++) {
fieldName = fields[i].replace("*.", prefix);
data[fieldName] = $("[name='" + fieldName + "']", context).val();
}
return data;
}
})(jQuery, kendo);
</script>
Grid initialization code:
#(Html.Kendo().Grid<KendoUIMVC5.Models.ProductViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Command(comm =>
{
comm.Edit();
});
columns.Bound(p => p.ProductID);
columns.Bound(p => p.ProductName);
})
.Pageable()
.Sortable()
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.Model(model =>
{
model.Id(p => p.ProductID);
})
.Read(read => read.Action("Read", "Home"))
.Update(update => update.Action("Update", "Home"))
)
)