Magento 2.4 PHP7.4

I need to move the validation of firstname field to click Place Order. This means when Place Order is clicked the firstname field validation should show. Previously the validation was showing when selecting the shipping method. I disabled that validation by modifying checkout_index_index.xml as shown in below code. I now included an additional payment validator which I think should generate validation on clicking Place order but that is not happening. I can trigger javascript alert pop-ups for the validation but that is not ideal.

According to my research, since the firstname field is not embedded inside a form it is not reacting to required attribute being added to it through javascript.

modification of checkout_index_index.xml

<item name="shipping-address-fieldset" xsi:type="array">
                                                                <item name="component" xsi:type="string">uiComponent</item>
                                                                <item name="config" xsi:type="array">
                                                                    <item name="deps" xsi:type="array">
                                                                        <item name="0" xsi:type="string">checkoutProvider</item>
                                                                    </item>
                                                                </item>
                                                                <item name="displayArea" xsi:type="string">additional-fieldsets</item>
                                                                <item name="children" xsi:type="array">
                                                                    <item name="firstname" xsi:type="array">
                                                                        <item name="config" xsi:type="array">
                                                                            <item name="validation" xsi:type="array">
                                                                                <item name="required-entry" xsi:type="boolean">false</item>
                                                                            </item>
                                                                        </item>
                                                                    </item>

additional payment validator -

<item name="additional-payment-validators" xsi:type="array">
                                                                <item name="component" xsi:type="string">uiComponent</item>
                                                                <item name="children" xsi:type="array">
                                                                    <!-- merge payment validators here -->
                                                                    <item name="email-validator" xsi:type="array">
                                                                        <item name="component" xsi:type="string">Magento_Checkout/js/view/payment/email-validator</item>
                                                                    </item>
                                                                    <item name="address-validator" xsi:type="array">
                                                                      <item name="component" xsi:type="string">Magento_Checkout/js/view/shipping-address/address-validator</item>
                                                                    </item>

address-validator (view)-

/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
 define(
    [
        'uiComponent',
        'Magento_Checkout/js/model/payment/additional-validators',
        'Magento_Checkout/js/model/default-validator'
    ],
    function (Component, additionalValidators, defaultValidator) {
        'use strict';
        console.log(defaultValidator);

        additionalValidators.registerValidator(defaultValidator);
        console.log("inside address validator");

        return Component.extend({});
    }
);

default validator (model)-

/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

define([
    'jquery',
    'mageUtils',
    './default-validation-rules',
    'mage/translate'
], function ($, utils, validationRules, $t) {
    'use strict';

    return {
        validationErrors: [],

        /**
         * @param {Object} address
         * @return {Boolean}
         */
        validate: function (address) {
            var self = this;

            this.validationErrors = [];
            $.each(validationRules.getRules(), function (field, rule) {
                var message;

                if (rule.required && utils.isEmpty(address[field])) {
                    message = $t('Field ')   field   $t(' is required.');

                    self.validationErrors.push(message);
                }
            });

            return !this.validationErrors.length;
        }
    };
});

validation rules -

/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

define([], function () {
    'use strict';

    return {
        /**
         * @return {Object}
         */
        getRules: function () {
            return {
                'country_id': {
                    'required': true
                },
                'firstname': {
                    'required': true
                }
            };
        }
    };
});

CodePudding user response：

The answer was found by contacting Amasty support - the dynamic validation need to be turned off (shipping-mixin.js).