Magento 2 - проверка формы

Ответы:

37

Вы можете добавить класс для проверки в Magento 2. См. Пример ниже. Существует почти 72 правила (класс валидации), которые вы можете использовать:

$fieldset->addField(
    'email_from',
    'text',
    ['name' => 'email_from', 'label' => __('Email From'), 'title' => __('Email From'), 'required' => true, 'class' => 'validate-email']
);

См. Блог для списка доступных правил для получения дополнительной информации:

Вот список правил классов валидации, поддерживаемых magento 2. Вам просто нужно добавить класс css для применения правила.

min_text_length
max_text_length
max-words
min-words
range-words
letters-with-basic-punc
alphanumeric
letters-only
no-whitespace
zip-range
integer
vinUS
dateITA
dateNL
time
time12h
phoneUS
phoneUK
mobileUK
stripped-min-length
email2
url2
credit-card-types
ipv4
ipv6
pattern
validate-no-html-tags
validate-select
validate-no-empty
validate-alphanum-with-spaces
validate-data
validate-street
validate-phoneStrict
validate-phoneLax
validate-fax
validate-email
validate-emailSender
validate-password
validate-admin-password
validate-url
validate-clean-url
validate-xml-identifier
validate-ssn
validate-zip-us
validate-date-au
validate-currency-dollar
validate-not-negative-number
validate-zero-or-greater
validate-greater-than-zero
validate-css-length
validate-number
validate-number-range
validate-digits
validate-digits-range
validate-range
validate-alpha
validate-code
validate-alphanum
validate-date
validate-identifier
validate-zip-international
validate-state
less-than-equals-to
greater-than-equals-to
validate-emails
validate-cc-number
validate-cc-ukss
required-entry
checked
not-negative-amount
validate-per-page-value-list
validate-new-password
validate-item-quantity
equalTo
Никундж Ганди
источник
2
Есть ли пример, как использовать шаблон? tnx
Антонио Педичини
35

Есть 3 различных способа использовать проверку формы в magento 2

Чтобы включить проверку JavaScript, используйте следующий код в вашем шаблоне

<form class="form" id="custom-form" method="post" autocomplete="off">
 <fieldset class="fieldset">
     <legend class="legend"><span><?php echo __('Personal Information') ?></span></legend><br>
      <div class="field required">
          <label for="email_address" class="label"><span><?php echo __('Email') ?></span></label>
          <div class="control">
              <input type="email" name="email" id="email_address" value="" title="<?php echo __('Email') ?>" class="input-text" data-validate="{required:true, 'validate-email':true}">
          </div>
      </div>
 </fieldset>
 <div class="actions-toolbar">
      <div class="primary">
          <button type="submit" class="action submit primary" title="<?php  echo __('Submit') ?>"><span><?php echo __('Submit') ?></span></button>
      </div>
  </div>
</form>

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>

* Пользовательская форма - это идентификатор формы, вы можете заменить ее идентификатором формы.

Список правил проверки формы

Чтобы завершить эту статью, здесь приведен список имен правил проверки в качестве краткого справочного руководства к официальной документации:

Magento правила:

validate-no-html-tags

validate-select

validate-no-empty

validate-alphanum-with-spaces

validate-data

validate-street

validate-phoneStrict

validate-phoneLax

validate-fax

validate-email

validate-emailSender

validate-password

validate-admin-password

validate-customer-password

validate-url

validate-clean-url

validate-xml-identifier

validate-ssn

validate-zip-us

validate-date-au

validate-currency-dollar

validate-not-negative-number

validate-zero-or-greater

validate-greater-than-zero

validate-css-length

validate-number

required-number

validate-number-range

validate-digits

validate-digits-range

validate-range

validate-alpha

validate-code

validate-alphanum

validate-date

validate-date-range

validate-cpassword

validate-identifier

validate-zip-international

validate-one-required

validate-state

required-file

validate-ajax-error

validate-optional-datetime

validate-required-datetime

validate-one-required-by-name

less-than-equals-to

greater-than-equals-to

validate-emails

validate-cc-type-select

validate-cc-number

validate-cc-type

validate-cc-exp

validate-cc-cvn

validate-cc-ukss

validate-length

required-entry

not-negative-amount

validate-per-page-value-list

validate-per-page-value

validate-new-password

required-if-not-specified

required-if-all-sku-empty-and-file-not-loaded

required-if-specified

required-number-if-specified

datetime-validation

required-text-swatch-entry

required-visual-swatch-entry

required-dropdown-attribute-entry

Validate-item-quantity

validate-grouped-qty

validate-one-checkbox-required-by-name

validate-date-between

validate-dob

max-words

min-words

range-words

letters-with-basic-punc

alphanumeric

letters-only

no-whitespace

zip-range

integer

vinUS

dateITA

dateNL

time

time12h

phoneUS

phoneUK

mobileUK

stripped-min-length

email2

url2

credit-card-types

ipv4

ipv6

pattern

allow-container-className

Правила jQuery:

required,

remote,

email,

url,

date,

dateISO,

number,

digits,

creditcard,

equalTo,

maxlength,

minlength,

rangelength,

range,

max,

min

см. http://inchoo.net/magento-2/validate-custom-form-in-magento-2/

Вайбхав Ахалпара
источник
Я хочу применить проверку на стороне сервера в magento 2can вы можете поделиться со мной любой ссылкой или документом,
Khushbu_sipl
Я думаю, что вы уже задавали вопрос здесь magento.stackexchange.com/questions/161300/… Пусть эта ссылка поможет другим
Вайбхав Ахалпара
9

В компонентах пользовательского интерфейса его можно использовать с помощью следующего примера конфигурации (Magento v2.2.0):

<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <fieldset name="general">
        <field name="priority" sortOrder="1000" formElement="input">
            <settings>
                <validation>
                    <rule name="not-negative-amount" xsi:type="boolean">true</rule>
                </validation>
                [...]
            </settings>
        </field>
    </fieldset>
</form>

Смотрите больше примеров в файле:
vendor/magento/module-cms/view/adminhtml/ui_component/cms_page_form.xml

Список валидаторов в компонентах пользовательского интерфейса можно найти в
vendor/magento/module-ui/view/base/web/js/lib/validation/rules.js.

Просто написал этот скрипт, чтобы получить все ключи с сообщениями об ошибках для объяснения:

  • обязательная запись:
    это обязательное поле.
  • validate-alphanum-with-Пробелы:
    Пожалуйста, используйте только буквы (az или AZ), цифры (0-9) или пробелы только в этом поле.
  • phoneUK:
    Пожалуйста, укажите правильный номер телефона
  • validate-email:
    Пожалуйста, введите действительный адрес электронной почты (например: johndoe@domain.com).
  • ipv4:
    пожалуйста, введите действительный IP v4 адрес.
  • проверил:
    это обязательное поле.
  • validate-select:
    Пожалуйста, выберите опцию.
  • ipv6:
    введите действительный IP-адрес v6.
  • время:
    пожалуйста, введите правильное время, между 00:00 и 23:59
  • validate-number:
    пожалуйста, введите правильный номер в это поле.
  • validate-phoneLax:
    Пожалуйста, введите правильный номер телефона. Например (123) 456-7890 или 123-456-7890.
  • dateITA:
    Пожалуйста, введите правильную дату
  • validate-xml-identifier:
    пожалуйста, введите действительный XML-идентификатор (например: что-то_1, block5, id-4).
  • validate-clean-url:
    Пожалуйста, введите действительный URL. Например, http://www.example.com или www.example.com.
  • validate-admin-password:
    пожалуйста, введите 7 или более символов, используя как цифры, так и буквы.
  • validate-no-html-tags:
    HTML-теги не допускаются.
  • validate-integer:
    введите правильное целое число в этом поле.
  • validate-data:
    Пожалуйста, используйте только буквы (az или AZ), цифры (0-9) или подчеркивание (_) в этом поле, и первый символ должен быть буквой.
  • validate-cc-ukss:
    Пожалуйста, введите номер выпуска или дату начала для типа карты switch / solo.
  • min-words:
    введите не менее {0} слов.
  • буквенно-цифровые: только
    буквы, цифры, пробелы или подчеркивания, пожалуйста
  • validate-identifier:
    Пожалуйста, введите действительный ключ URL (например: "example-page", "example-page.html" или "anotherlevel / example-page").
  • validate-street:
    Пожалуйста, используйте только буквы (az или AZ), цифры (0-9), пробелы и "#" в этом поле.
  • validate-zip-international:
    Пожалуйста, введите действительный почтовый индекс.
  • validate-date:
    Пожалуйста, введите действительную дату.
  • validate-more-than-zero:
    Пожалуйста, введите число больше 0 в этом поле.
  • validate-digits:
    Пожалуйста, введите правильный номер в это поле.
  • validate-ssn:
    Пожалуйста, введите действительный номер социального страхования (например: 123-45-6789).
  • неотрицательная сумма:
    пожалуйста, введите положительное число в это поле.
  • validate-max-size:
    Файл, который вы пытаетесь загрузить, превышает максимальный размер файла.
  • validate-fax:
    Пожалуйста, введите действительный номер факса (например: 123-456-7890).
  • validate-if-tag-script-Существовать:
    Пожалуйста, используйте тег SCRIPT с атрибутом SRC или с соответствующим содержимым, чтобы включить JavaScript в документ.
  • min_text_length:
    пожалуйста, введите больше или равно {0} символов.
  • validate-date-au:
    Пожалуйста, используйте этот формат даты: дд / мм / гггг. Например, 17.03.2006 г. от 17 марта 2006 г.
  • mobileUK:
    Пожалуйста, укажите действительный номер мобильного телефона
  • буквы с базовыми точками: только
    буквы или знаки препинания, пожалуйста
  • validate-number-range:
    значение находится за пределами указанного диапазона.
  • phoneUS:
    Пожалуйста, укажите правильный номер телефона
  • date_range_max:
    дата не в указанном диапазоне.
  • validate-range:
    значение находится за пределами указанного диапазона.
  • vinUS:
    указанный идентификационный номер автомобиля (VIN) недействителен.
  • диапазон слов:
    введите от {0} до {1} слов.
  • validate-zip-us:
    Пожалуйста, введите действительный почтовый индекс (например: 90602 или 90602-1234).
  • validate-emails:
    введите правильные адреса электронной почты через запятую. Например, johndoe@domain.com, johnsmith@domain.com.
  • validate-css-length:
    Пожалуйста, введите правильную длину CSS (например: 100px, 77pt, 20em, .5ex или 50%).
  • zip-range:
    Ваш почтовый индекс должен быть в диапазоне от 902xx-xxxx до 905-xx-xxxx
  • validate-phoneStrict:
    Пожалуйста, введите правильный номер телефона. Например (123) 456-7890 или 123-456-7890.
  • dateNL: Vul
    hier een geldige datum in.
  • только буквы:
    только буквы, пожалуйста
  • max_text_length:
    пожалуйста, введите меньше или равно {0} символов.
  • validate-not-отрицательный-номер:
    Пожалуйста, введите номер 0 или больше в этом поле.
  • validate-per-page-value-list:
    Пожалуйста, введите правильное значение, например: 10,20,30
  • без пробелов:
    нет пробелов, пожалуйста
  • подтвердить штат:
    пожалуйста, выберите штат / провинцию.
  • validate-url:
    пожалуйста, введите действительный URL. Требуется протокол (http: //, https: // или ftp: //).
  • date_range_min:
    дата не в указанном диапазоне.
  • validate-digits-range:
    значение находится за пределами указанного диапазона.
  • больше, чем равно:
    введите значение, большее или равное {0}.
  • validate-no-empty:
    пустое значение.
  • validate-zero-or-more:
    Пожалуйста, введите число 0 или больше в этом поле.
  • validate-cc-number:
    пожалуйста, введите действительный номер кредитной карты.
  • validate-emailSender:
    Пожалуйста, введите действительный адрес электронной почты (например: johndoe@domain.com).
  • validate-new-password:
    Пожалуйста, введите 6 или более символов. Начальные и конечные пробелы будут игнорироваться.
  • validate-customer-password:
    минимальная длина этого поля должна быть равна или больше, чем% 1 символов. Начальные и конечные пробелы будут игнорироваться.
  • validate-password:
    пожалуйста, введите 6 или более символов. Начальные и конечные пробелы будут игнорироваться.
  • меньше чем равно:
    введите значение, меньшее или равное {0}.
  • validate-currency-dollar:
    Пожалуйста, введите действительную сумму в долларах. Например, 100,00 долларов.
  • time12h:
    пожалуйста, введите правильное время с 00:00 до 12:00.
  • validate-alphanum:
    Пожалуйста, используйте только буквы (az или AZ) или цифры (0-9) в этом поле. Пробелы или другие символы не допускаются.
  • validate-item-amount:
    Мы не распознаем или не поддерживаем этот тип расширения файла.
  • validate-code:
    пожалуйста, используйте только буквы (az), цифры (0-9) или подчеркивание (_) в этом поле, и первый символ должен быть буквой.
  • email2:
    Пожалуйста, введите действительный номер кредитной карты.
  • max-words:
    пожалуйста, введите {0} слов или меньше.
  • минимальная длина:
    пожалуйста, введите не менее {0} символов
  • validate-alpha:
    пожалуйста, используйте только буквы (az или AZ) в этом поле.
  • шаблон:
    неверный формат.
  • целое число:
    положительное или отрицательное не десятичное число, пожалуйста

Сценарий:

declare -A list
key=''
while IFS= read -r line; do
#  echo "${line} -"
  if [ -z "${key:-}" ]; then
    # match validation key
    match=$(echo "${line}" | grep -Eo "^        ['\"]([A-Za-z0-9-]|_)+" | tr -d "' ")
    if [ -n "${match}" ]; then
      key=${match}
    fi
  else
    # match message
    match=$(echo "${line}" | sed -rn "s|.*\\$\.mage\.__[(]['\"](.*)['\"][)].*|\1|p")
    if [ -n "${match}" ]; then
      list[${key}]=${match}
      key=''
    fi
  fi
done < "${DOCROOT_DIR:-/var/www/html}/vendor/magento/module-ui/view/base/web/js/lib/validation/rules.js"

for i in "${!list[@]}"
do
  printf "%s:\n    %s\n" "${i}" "${list[$i]}"
done
Kirby
источник
3

Если вы воспользуетесь ссылкой на страницу / customer / account / create, под формой вы увидите следующий фрагмент кода:

<script>
require([
    'jquery',
    'mage/mage'
], function($){

    var dataForm = $('#form-validate');
    var ignore = null;

    dataForm.mage('validation', {
            ignore: ignore ? ':hidden:not(' + ignore + ')' : ':hidden'
        }).find('input:text').attr('autocomplete', 'off');

});
</script>

И если вы проверите входные атрибуты формы, вы увидите Magento 1 как classзначения атрибутов вместе с новым data-validateатрибутом. Это может быть основой для повышения.

Файлы ключей для проверки:

MagePsycho
источник
Спасибо за ответ. Я нашел новый атрибут data-validate, но интересно, какие проверки доступны. В моем случае я хочу проверить флажок и набор RadioButton
ClassMP
Я хочу применить проверку на стороне сервера в magento 2, можете ли вы поделиться со мной какой-либо ссылкой или документом.
Khushbu_sipl
2

Когда для создания формы используются компоненты пользовательского интерфейса , мы можем использовать валидацию, как показано ниже, она работает в Magento 2.1.x, я еще не тестировал ее в другой версии.

<field name="priority">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="dataType" xsi:type="string">text</item>
            <item name="label" xsi:type="string" translate="true">Priority</item>
            <item name="formElement" xsi:type="string">input</item>
            <item name="source" xsi:type="string">module_name</item>
            <item name="dataScope" xsi:type="string">priority</item>
            <item name="validation" xsi:type="array">
                <item name="required-entry" xsi:type="boolean">true</item>
                <item name="validate-integer" xsi:type="boolean">true</item>
            </item>
        </item>
    </argument>
</field>

Обратите внимание на элемент проверки , в него можно добавить правила проверки , например required-entry, validate-integerи т. Д.

<item name="validation" xsi:type="array">
     <item name="required-entry" xsi:type="boolean">true</item>
     <item name="validate-integer" xsi:type="boolean">true</item>
     <item name="validation_rule_name" xsi:type="boolean">true</item>
     ...
</item>

Все правила проверки вы можете найти в файле vendor/magento/module-ui/view/base/web/js/lib/validation/rules.js, например validate-date, validate-emailsи т. Д.

Ключ Шан
источник
1

У меня есть такое же требование для проверки формы Magento2, и я сделал этот код

Сначала мы настроим тестовую форму

<!-- form tag -->
<form class="form" id="custom-form-id" method="post" autocomplete="off">
   <fieldset class="fieldset">
       <legend class="legend"><span><?php echo __('User Personal Information') ?></span></legend><br>
        <div class="field required">
            <!-- form field -->
            <label for="email_address" class="label"><span><?php echo __('Email') ?></span></label>
            <div class="control">
                <input type="email" name="email" id="email_address" value="" title="<?php echo __('Email') ?>" class="input-text" data-validate="{required:true, 'validate-email':true}">
            </div>
        </div>
   </fieldset>
   <!-- submit button -->
   <div class="actions-toolbar">
        <div class="primary">
            <button type="submit" class="action submit primary" title="<?php  echo __('Submit') ?>"><span><?php echo __('Submit') ?></span></button>
        </div>
    </div>
</form>

Чтобы включить проверку JavaScript для проверки формы Magento2

<!-- enable javascript validation for custom-form-id -->
<script type="text/x-magento-init">
    {
        "#custom-form-id": {
            "validation": {}
        }
    }
</script>

Ссылка :: http://www.onlinecode.org/magento2-form-validation-example/

Давал Дэйв
источник
0

Опция «no-whitespace» работает некорректно (по крайней мере, в Magento 2.1). Это вызывает сообщение об ошибке на любом типе символа «пробел». Значения «test me» и «test me» будут возвращать одну и ту же ошибку.

Станислав Спузяк
источник