Проверка формы Magento 2: минимальная/максимальная длина
Я пытаюсь добавить некоторые из предопределенных проверок в элемент формы, но в настоящее время это не удается. Насколько я могу судить, все правила проверки могут быть добавлены с помощью классов, но нигде не сказано, как установить параметры для некоторых правил. Т.е.: максимальная длина.
Вот то, что у меня в настоящее время не работает (я удалил некоторые из не относящихся к делу атрибутов. Я пытаюсь установить минимум 7 символов на входе.
<input name="telephone" id="telephone" data-validate="{required:true}" class="validate-length minimum-length-7 maximum-length-20 input-text" type="text" />
Спасибо за ваше помощь
5
2 answers
Ваш код полностью верен.
Оба minimum и maximum должны быть установлены с помощью minimum-length-[0-9]+$ и maximum-length-[0-9]+$
Чего вам не хватает, так это обновить атрибут data-validate, заменив:
{required:true}
С помощью:
{required:true, 'validate-length':true}
Также вам необходимо убедиться, что ваша пользовательская форма проверена с помощью JavaScript одним из следующих методов:
Прямой JS
<script type="text/x-magento-init">
{
"#id-of-your-form": {
"validation": {}
}
}
</script>
Атрибут HTML
Добавив следующий атрибут к вашему form тег:
data-mage-init='{"validation": {}}'
Использование RequireJS
<script type="text/javascript">
require([
'jquery',
'mage/mage'
], function($){
var dataForm = $('#id-of-your-form');
dataForm.mage('validation', {});
});
</script>
15
Author: Raphael at Digital Pianism, 2016-12-19 16:03:02
Вы можете легко изменить правила проверки для ввода с помощью XML.
В вашем случае предположим, что вы хотите добавить минимальную максимальную длину в форму адреса доставки при оформлении заказа. Что вам нужно сделать, так это расширить checkout_index_index.xml в вашей теме вот так: app/design/frontend/...../..../Magento_Checkout/layout/checkout_index_index.xml
Затем внутри него укажите элемент, в который вы хотите добавить правила проверки, например:
<?xml version="1.0"?>
<!--
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="checkout" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <body>
<referenceBlock name="checkout.root">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
<item name="checkout" xsi:type="array">
<item name="children" xsi:type="array">
<item name="steps" xsi:type="array">
<item name="children" xsi:type="array">
<item name="shipping-step" xsi:type="array">
<item name="children" xsi:type="array">
<item name="shippingAddress" xsi:type="array">
<item name="children" xsi:type="array">
<!-- To affect the shipping address fields -->
<item name="shipping-address-fieldset" xsi:type="array">
<item name="children" xsi:type="array">
<item name="company" xsi:type="array">
<item name="telephone" xsi:type="array">
<!-- Classes for data validation: -->
<item name="max_text_length" xsi:type="number">7</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</argument>
</arguments>
</referenceBlock>
</body>
</page>
Вот список всех доступных проверок magento2, которые вы можете использовать при вводе этих форм (также добавлена текстовая ошибка magento покажите, чтобы это помогло понять, что они делают):
'validate-no-html-tags', 'HTML tags are not allowed'
'validate-select', 'Please select an option.'
'required-entry', 'This is a required field.'
'validate-number', 'Please enter a valid number in this field.'
'validate-number-range', 'The value is not within the specified range.'
'validate-digits', 'Please use numbers only in this field. Please avoid spaces or other characters such as dots or commas.'
'validate-digits-range', 'The value is not within the specified range.'
'validate-range', 'The value is not within the specified range.'
'validate-alpha', 'Please use letters only (a-z or A-Z) in this field.'
'validate-code', 'Please use only letters (a-z), numbers (0-9) or underscore (_) in this field, and the first character should be a letter.'
'validate-alphanum', 'Please use only letters (a-z or A-Z) or numbers (0-9) in this field. No spaces or other characters are allowed.'
'validate-alphanum-with-spaces', 'Please use only letters (a-z or A-Z), numbers (0-9) or spaces only in this field.'
'validate-street', 'Please use only letters (a-z or A-Z), numbers (0-9), spaces and "#" in this field.'
'validate-phoneStrict', 'Please enter a valid phone number (Ex: 123-456-7890).'
'validate-phoneLax', 'Please enter a valid phone number (Ex: 123-456-7890).'
'validate-fax', 'Please enter a valid fax number (Ex: 123-456-7890).'
'validate-date', 'Please enter a valid date.'
'validate-date-range', 'Make sure the To Date is later than or the same as the From Date.'
'validate-email', 'Please enter a valid email address (Ex: [email protected]).'
'validate-emailSender', 'Please use only visible characters and spaces.'
'validate-password', 'Please enter 6 or more characters. Leading and trailing spaces will be ignored.'
'validate-admin-password', 'Please enter 7 or more characters, using both numeric and alphabetic.'
'validate-cpassword', 'Please make sure your passwords match.'
'validate-both-passwords', 'Please make sure your passwords match.'
'validate-url', 'Please enter a valid URL. Protocol is required (http://, https:// or ftp://)'
'validate-clean-url', 'Please enter a valid URL (Ex: "http://www.example.com" or "www.example.com").'
'validate-identifier', 'Please enter a valid URL Key (Ex: "example-page", "example-page.html" or "anotherlevel/example-page").'
'validate-xml-identifier', 'Please enter a valid XML-identifier (Ex: something_1, block5, id-4).'
'validate-ssn', 'Please enter a valid social security number (Ex: 123-45-6789).'
'validate-zip-us', 'Please enter a valid zip code (Ex: 90602 or 90602-1234).'
'validate-zip-international', 'Please enter a valid zip code.'
'validate-date-au', 'Please use this date format: dd/mm/yyyy (Ex: "17/03/2006" for the 17th of March, 2006).'
'validate-currency-dollar', 'Please enter a valid $ amount (Ex: $100.00).'
'validate-one-required', 'Please select one of the options above.'
'validate-one-required-by-name', 'Please select one of the options.'
'validate-not-negative-number', 'Please enter a number 0 or greater in this field.'
'validate-zero-or-greater', 'Please enter a number 0 or greater in this field.'
'validate-greater-than-zero', 'Please enter a number greater than 0 in this field.'
'validate-state', 'Please select State/Province.'
'validate-new-password', 'Please enter 6 or more characters. Leading and trailing spaces will be ignored.'
'validate-cc-number', 'Please enter a valid credit card number.'
'validate-cc-type', 'Credit card number does not match credit card type.'
'validate-cc-type-select', 'Card type does not match credit card number.'
'validate-cc-exp', 'Incorrect credit card expiration date.'
'validate-cc-cvn', 'Please enter a valid credit card verification number.'
'validate-data', 'Please use only letters (a-z or A-Z), numbers (0-9) or underscore (_) in this field, and the first character should be a letter.'
'validate-css-length', 'Please input a valid CSS-length (Ex: 100px, 77pt, 20em, .5ex or 50%).'
'validate-length', 'Text length does not meet the specified text range.'
'validate-percents', 'Please enter a number lower than 100.'
'required-file', 'Please select a file.'
'validate-cc-ukss', 'Please enter issue number or start date for switch/solo card type.'
2
Author: Andrei, 2018-11-20 13:40:44