{"id":952,"date":"2023-12-22T16:06:55","date_gmt":"2023-12-22T10:36:55","guid":{"rendered":"https:\/\/magecurious.com\/blog\/?p=952"},"modified":"2025-01-11T22:50:47","modified_gmt":"2025-01-11T17:20:47","slug":"how-to-add-custom-validation-rule-in-configuration-file-in-magento-2","status":"publish","type":"post","link":"https:\/\/magecurious.com\/blog\/how-to-add-custom-validation-rule-in-configuration-file-in-magento-2\/","title":{"rendered":"How to Add Custom Validation Rule in Configuration File in Magento 2"},"content":{"rendered":"\n

Hello Everyone,<\/p>\n\n\n\n

In this blog, we will learn about how to Add Custom Validation Rule in Configuration file system.xml in Magento 2.<\/p>\n\n\n\n

Magento 2 provides lots of default validation rules, but sometimes we need to add our custom validation like validate a mobile number field with a minimum 10 digit number.<\/p>\n\n\n\n

Without wasting your time, let us guide you straight away. Follow the easy step given below to Add Custom Validation Rule in Configuration File in Magento 2.<\/p>\n\n\n\n

STEPS FOR ADD CUSTOM VALIDATION RULE IN CONFIGURATION FILE IN MAGENTO 2    <\/strong><\/p>\n\n\n\n

Step 1: Update system.xml file<\/strong><\/p>\n\n\n\n

app\/code\/Vendor\/Extension\/etc\/adminhtml\/system.xml<\/strong><\/p>\n\n\n

\n<?xml version="1.0"?>\n\n<config xmlns:xsi="http:\/\/www.w3.org\/2001\/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc\/system_file.xsd">\n\n\u00a0\u00a0\u00a0\u00a0<system>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<tab id="magecurious" class="magecurious" translate="label" sortOrder="10">\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<label>Magecurious<\/label>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/tab>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<section id="extension" translate="label" sortOrder="10" showInDefault="1" showInWebsite="1" showInStore="1">\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<class>separator-top<\/class>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<label>Magecurious<\/label>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<tab>magecurious<\/tab>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<resource>Vendor_Extension::config_extension<\/resource>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<group id="general" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="1" showInStore="1">\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<label>General Configuration<\/label>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<field id="enable" translate="label" type="select" sortOrder="1" showInDefault="1" showInWebsite="1" showInStore="1">\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<label>Enable Extension<\/label>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<source_model>Magento\\Config\\Model\\Config\\Source\\Enabledisable<\/source_model>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/field>\n\n<field id="mobileno" translate="label" type="text" sortOrder="1" showInDefault="1" showInWebsite="1" showInStore="1">\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<label>Mobile Number<\/label>\n\n<validate>required-entry validate-ten-digit<\/validate>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/field>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/group>\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/section>\n\n\u00a0\u00a0\u00a0\u00a0<\/system>\n\n<\/config>\n<\/pre><\/div>\n\n\n
In above code we used <validate>required-entry validate-ten-digit<\/validate> which is our new validation rule.<\/p>\n\n\n\n
Here \u201cvalidate-ten-digit\u201d is a Custom validation class.<\/p>\n\n\n\n
Step 2: Create requirejs-config.js file<\/strong><\/p>\n\n\n\n
app\/code\/Vendor\/Extension\/view\/adminhtml\/requirejs-config.js<\/strong><\/p>\n\n\n
\nvar config = {\n\n\u00a0\u00a0\u00a0\u00a0config: {\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0mixins: {\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'mage\/validation': {\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'Vendor_Extension\/js\/admin-config\/validator-rules-mixin': true\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\n\u00a0\u00a0\u00a0\u00a0}\n\n};\n<\/pre><\/div>\n\n\n
Step 3: Create validator-rules-mixin.js file<\/strong><\/p>\n\n\n\n
app\/code\/Vendor\/Extension\/view\/adminhtml\/web\/js\/admin-config\/validator-rules-mixin.js<\/strong><\/p>\n\n\n
\ndefine([\n\n'jquery'\n\n], function ($) {\n\n\u00a0\u00a0\u00a0\u00a0'use strict';\n\n\u00a0\u00a0\u00a0\u00a0return function (target) {\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$.validator.addMethod(\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'validate-ten-digit',\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0function (value) {\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return !(value.length < 10);\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0},\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$.mage.__('Please enter a 10 digit number.')\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0);\n\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return target;\n\n\u00a0\u00a0\u00a0\u00a0};\n\n});\n<\/pre><\/div>\n\n\n
Step 4: Finally run the below commands<\/strong><\/p>\n\n\n
\n$ php bin\/magento setup:upgrade\n\n$ php bin\/magento cache:clean\n\n$ php bin\/magento cache:flush\n<\/pre><\/div>\n\n\n
Step 5: Output:<\/strong><\/p>\n\n\n\n
\"\"\/<\/figure>\n\n\n\n
<\/div>\n\n\n\n
Final Thoughts:<\/strong><\/p>\n\n\n\n
So this was the easiest way which we have told you in this blog. This is how you can Add Custom Validation in the system.xml configuration file in Magento 2. Hope you liked the blog.<\/p>\n\n\n\n
So quickly go to the comment box and tell me how you like this blog?<\/p>\n\n\n\n
Stay tuned with us on our site to get new updates of Magento.<\/strong><\/p>\n\n\n\n
Thanks for reading and visiting our site.<\/p>\n\n\n
      
          
        How useful was this post?      <\/p>              
        Click on a star to rate it!      <\/p>        
      
                      
  •               <\/i>          <\/li>                  
  •               <\/i>          <\/li>                  
  •               <\/i>          <\/li>                  
  •               <\/i>          <\/li>                  
  •               <\/i>          <\/li>              <\/ul>    <\/div>    
    <\/p>