Magento 2 как проверить форму и отобразить сообщение об ошибке под полем ввода
В magento 1.x мы используем следующий код для проверки форм Magento:
<script type="text/javascript">
var myForm= new VarienForm('contactstore', true);
</script>
Я использую этот код из контактной формы magento 2:
<div class="field email required">
<label class="label" for="email"><span>Email</span></label>
<div class="control">
<input name="email" id="email" title="Email" value="" class="input-text" type="email" data-validate="{required:true, 'validate-email':true}" aria-required="true">
</div>
</div>
Мой вопрос: как мне проверить пользовательскую форму в Magento 2?
3 answers
Вам нужно добавить data-mage-init='{"проверка":{}}' объявление внутренней формы следующим образом:
<form class="form contact"
action="<?php /* @escapeNotVerified */ echo $block->getFormAction(); ?>"
id="contact-form"
method="post"
data-hasrequired="<?php /* @escapeNotVerified */ echo __('* Required Fields') ?>"
data-mage-init='{"validation":{}}'>
Проверка формы может быть применена тремя способами:
1)
<script type="text/x-magento-init">
{
"#custom-form": {
"validation": {}
}
}
</script>
2)
<form data-mage-init='{"validation": {}}'
class="form" id="custom-form" method="post" autocomplete="off">
3)
<script type="text/javascript">
require([
'jquery',
'mage/mage'
], function($){
var dataForm = $('#custom-form');
dataForm.mage('validation', {});
});
</script>
Кроме того, вам может потребоваться проверка, классифицированная из приведенного ниже списка. Вам просто нужно добавить класс css для применения правила.
Минимальная длина текста
Максимальная длина текста
Максимальное количество слов минимальное количество слов
Диапазон слов
Буквы-с-основным-пунктуацией
Буквенно-цифровой
Только буквы
Без пробелов
Смотрите больше по этой ссылке: http://blog.i13websolution.com/magento-2-validation-rules/
Идентификатор формы: #пользовательская форма регистрации
Перед отправкой формы Проверьте правильность
Для Проверки Всех Полей И Отображения Ошибки:
$('#custom-register-form').on('submit', function (event) {
var dataForm = jQuery('#custom-register-form');
if(dataForm.validation('isValid') === false){
return false;
}});
Для Отдельных Полей И Ошибка отображения:
$("#custom-register-form input").bind('keyup focusout autocompletechange change', function (){$(this).valid();});