У меня есть панель замораживания, которая появляется, когда пользователь отправляет форму, не позволяя им нажимать на какие-либо другие элементы управления на странице. Это отлично работает вместе с проверкой элементов управления формы из атрибутов, установленных на моем MVC Service Control.
Проблема заключается в том, что пользователь вводит адрес электронной почты с пробелом между именем учетной записи и знаком @- someName @email.com. Я получаю небольшой белый всплывающее окно, подтверждающее сообщение об ошибке, указывающее на текстовое поле электронной почты. Я предполагаю это из jQuery, потому что метод Create Control никогда не срабатывает. Большая проблема заключается в том, что панель замораживания остается на месте, поэтому вы не можете исправить проблему, пока не обновите страницу.
Я новичок, когда дело доходит до jQuery и утеряно, как исправить эту проблему. Я предполагаю, что мне нужно определить, когда jQuery уволил исключение проверки для неправильного адреса электронной почты, так что я могу изменить свойство css для панели замораживания обратно в скрытое состояние.
Любая помощь будет значительно исключена!
В моем классе модели у меня есть это свойство для электронной почты.
[Required(ErrorMessage = "Email required")]
[StringLength(125), EmailAddress(), Display(Name = "Email Address")]
public string Email { get; set; }
И в моем контроллере у меня есть этот простой метод создания.
[HttpPost]
public ActionResult Create(ClientService clientservice)
{
if (ModelState.IsValid)
{
context.ClientServices.Add(clientservice);
context.SaveChanges();
return RedirectToAction("Completed");
}
return View("Create");
}
My Create view У меня есть этот код, который загружает частичный вид, содержащий элементы управления ввода, а также панель замораживания панели и скрипт jQuery, управляющий панелью.
@using (Html.BeginForm()) {
@Html.ValidationSummary(true)
<fieldset class="user-input">
<legend>Client Service</legend>
<h2 class="margin-indent">How to contact -</h2><br />
@Html.Partial("_CreateOrEdit", Model)
<p class="margin-indent">
<input id="pageSubmit" type="submit" value="Submit" />
</p>
</fieldset>
}
<div id="FreezePane" class="FreezePaneOff">
<div id="InnerFreezePane" class="InnerFreezePane"> </div>
</div>
<script type="text/javascript">
$(function () {
$('#pageSubmit').click(function (event) {
var itemErrors = validator.numberOfInvalids();
if (itemErrors >= 1) {
event.preventDefault();
} else {
$('html,body').scrollTop(10);
$('#FreezePane').toggleClass('FreezePaneOn');
$('#InnerFreezePane').text("Processing...");
}
});
</script>
После некоторого поиска я наткнулся на этот бит кода, который делает именно то, что мне нужно. Он фиксирует отправку и прикрепляет обработчик для предотвращения действия по умолчанию на кнопке после проверки формы.
$('form').one('submit', function (evt) {
//unhide the freeze panel after validating form
$('html,body').scrollTop(10);
$('#FreezePane').toggleClass('FreezePaneOn');
$('#InnerFreezePane').text("Processing...");
/**
* disable default action (this handler will be attached after first
* submit event and it will prevent any further submit action
*/
$(this).on('submit', function (evt) {
evt.preventDefault();
});
Что вы должны сделать, так это: инициализировать панель замораживания только после того, как все проверки пройдены и форма будет отправлена. Таким образом, если есть ошибка проверки, пользователь все равно может редактировать поле и снова отправить сообщение.
Это будет работать при условии, что проверка электронной почты выполняется на клиенте, который является JS. Если вы не уверены в этом, попробуйте найти источник проверки. Вы можете дать мне более подробную информацию о том, что это такое... как скрипичный след всей усеказы и т.д.