Я использую ядро .NET с шаблонной платформой и у меня проблемы с проверкой данных на стороне клиента.Насколько я понимаю, аннотации данных, используемые в DTO, проверяются на стороне сервера.Я ищу способ выполнить эту проверку на стороне клиента, и я подумал, что я мог бы просто использовать его, создав объект этого DTO в моих моделях представления и используя проверку модели представления, как я привык делать это с .NETядро.
Что я пытаюсь сделать:
Я пытаюсь получить подтверждение данных в моей форме, используя аннотации данных из DTO.Моя модель представления содержит объект DTO в качестве свойства и использует его в своей форме.Кажется, он выполняет проверку, поскольку не будет отправлять, пока все не будет правильно, однако он не будет показывать никакой проверки, КРОМЕ проверки для ввода по электронной почте;и я не уверен, почему он будет делать это для электронной почты и ничего больше.
Вот мое представление
<form asp-action="AddEmergencyContactPost" method="post" id="addEmergencyContactForm" role="form">
<div class="row clearfix">
<div class="col-sm-12">
<div class="form-group form-float">
<div class="form-line">
<input asp-for="EmergencyContact.PhoneNumber" type="tel" class="validate form-control">
<label asp-for="EmergencyContact.PhoneNumber" class="form-label"></label>
<span asp-validation-for="EmergencyContact.PhoneNumber" class="text-danger"></span>
</div>
</div>
</div>
</div>
</form>
Вот мое свойство DTO и то, как модель представления использует объект
//DTO property
[Required]
[StringLength(10, MinimumLength = 10, ErrorMessage = "Invalid Phone Number")]
public string PhoneNumber { get; set; }
//View Model
public CreateEmergencyContactDto EmergencyContact { get; set; }
А вот javascript, который обрабатывает запрос
$("#addEmergencyContactForm").on("submit",
function (e) {
e.preventDefault();
debugger;
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function (data) {
if (data.result === "success") {
swal({
title: "Emergency Contact Added",
icon: "success"
}).then(function () {
location.reload();
});
} else {
swal({
title: "Please Enter the Correct Type of Data",
icon: "warning"
}).then(function () {
location.reload();
});
}
_$modal.modal("toggle");
}
});
});
Что я уже пробовал:
Пока яя попытался добавить тип к помощнику по тегу 'tel' и вернуть представление, если состояние модели недопустимо.Я также попытался сделать объект в модели представления обязательным, но при этом устанавливаются только обязательные теги для всех полей (и по какой-то причине выполняется только проверка для одного поля за раз).Ниже приведен рисунок, показывающий, как проверяется электронная почта, но ничего не происходит.
Я также пытался использовать jquery validate, но всякий раз, когда я проверяю, верна ли форма, она всегда возвращает true, несмотря ни на что.Я также попытался установить флаги проверки явно, но затем я получаю сообщение об ошибке, показанное ниже
Вот код, который я использовал для добавления явной проверки.
$(this).validate({
rules: {
EmergencyContact.PhoneNumber: {
required: true,
minlength: 10,
phoneUS: true
}
},
messages: {
EmergencyContact.PhoneNumber{
required: "Please Enter A Phone Number",
phoneUS: "Please Enter A Valid Phone Number",
minLength: "Please Enter A Valid Phone Number"
}
}
});
Итак, есть ли способ выполнить эту проверку на стороне клиента с помощью этих помощников аннотаций данных?И если нет, то какой будет самый простой способ выполнить проверку на стороне клиента для моей формы, которая содержится в моем индексе, а не частично?Заранее благодарим за любую помощь, которую вы можете оказать.
РЕДАКТИРОВАТЬ : Вот шаблон запуска, который я использую из шаблона