Magento 2: How to Implement Validation in UI-Component with parameters

Question

Ok. Everyone's got an answer on how to add validation rules to a ui-component field via XML. Unfortunately, I can't find anyone that seems to know how to implement a rule that requires a parameter or two. I'm sure the knowledge is out there, but nobody's asked the question. So here it is.

I'm looking to implement the min-words validation rule for a textarea. I've got something like this:

<field name="text_area">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            ...
            <item name="validation" xsi:type="array">
                <item name="required-entry" xsi:type="boolean">true</item>
                <item name="min-words" xsi:type="array">
                    <item name="length" xsi:type="number">10</item>
                </item>
            </item>
            ...
        </item>
    </argument>
</field>

but I'm guessing, and this doesn't quite work. I'm close, but can't figure out what the "length" parameter is really supposed to be, and looking at the rules.js file doesn't provide any clues.

Answer 1

enter image description hereYou can find the list of all validation rules here.

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

For Example:

<field name="email">
            <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">Email Address</item>
                    <item name="formElement" xsi:type="string">input</item>
                    <item name="source" xsi:type="string">email</item>
                    <item name="dataScope" xsi:type="string">email</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                        <item name="validate-email" xsi:type="boolean">true</item>
                    </item>
                </item>
            </argument>
        </field>

With minimum word range:

<field name="address">
            <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">Address</item>
                    <item name="formElement" xsi:type="string">input</item>
                    <item name="source" xsi:type="string">address</item>
                    <item name="dataScope" xsi:type="string">address</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                        <item name="min-words" xsi:type="number">10</item>
                    </item>
                </item>
            </argument>
        </field>

Answer 2

So for the min-words rule, I found that it's simply:

<item name="min-words" xsi:type="number">10</item>

Having seen other implementations of parameters (not in validation rules), I thought I'd try this for the range-words rule, and discovered this format:

<item name="range-words" xsi:type="array">
   <item name="0" xsi:type="number">5</item>
   <item name="1" xsi:type="number">10</item>
</item>

This format would serve similar rules that require parameters, such as zip-range, validate-number-range, validate-digits-range, validate-range, validate-date-range, validate-item-quantity, validate-file-type. Being mindful to use the name="0" as array index for each entry.