How is the backend configurable product's form validated on the «Save» button click?

dmitrii_fediuk · June 12, 2021, 2:24pm

1. `Magento\ConfigurableProduct\Block\Adminhtml\Product\Edit\Button\Save::getSaveAction()`

magento/magento2/blob/2.4.2-p1/app/code/Magento/ConfigurableProduct/Block/Adminhtml/Product/Edit/Button/Save.php#L141-L153


/**
 * Retrieve action for button.
 *
 * @return string
 */
protected function getSaveAction()
{
    $action = 'save';
    if ($this->isConfigurableProduct()) {
        $action = 'saveFormHandler';
    }
    return $action;
}

2.

github.com

magento/magento2/blob/2.4.2-p1/app/code/Magento/ConfigurableProduct/view/adminhtml/web/js/variations/variations.js#L382-L405


/**
 * Chose action for the form save button
 */
saveFormHandler: function () {
    this.formElement().validate();
    if (this.formElement().source.get('params.invalid') === false) {
        this.serializeData();
    }
    if (this.checkForNewAttributes()) {
        this.formSaveParams = arguments;
        this.attributeSetHandlerModal().openModal();
    } else {
        if (this.validateForm(this.formElement())) {
            this.clearOutdatedData();
        }
        this.formElement().save(arguments[0], arguments[1]);
        if (this.formElement().source.get('params.invalid')) {
            this.unserializeData();
        }
    }
},

3.

github.com

magento/magento2/blob/2.4.2-p1/app/code/Magento/Ui/view/base/web/js/form/form.js#L327-L335


/**
 * Validates each element and returns true, if all elements are valid.
 */
validate: function () {
    this.additionalFields = document.querySelectorAll(this.selector);
    this.source.set('params.invalid', false);
    this.source.trigger('data.validate');
    this.set('additionalInvalid', !isValidFields(this.additionalFields));
},

4.

github.com

magento/magento2/blob/2.4.2-p1/app/code/Magento/Ui/view/base/web/js/form/element/abstract.js#L397-L423


/**
 * Validates itself by it's validation rules using validator object.
 * If validation of a rule did not pass, writes it's message to
 * 'error' observable property.
 *
 * @returns {Object} Validate information.
 */
validate: function () {
    var value = this.value(),
        result = validator(this.validation, value, this.validationParams),
        message = !this.disabled() && this.visible() ? result.message : '',
        isValid = this.disabled() || !this.visible() || result.passed;
    this.error(message);
    this.error.valueHasMutated();
    this.bubble('error', message);
    //TODO: Implement proper result propagation for form
    if (this.source && !isValid) {
        this.source.set('params.invalid', true);
    }
    return {
        valid: isValid,
        target: this
    };
},

How is the backend configurable product's form validated on the «Save» button click?

1. Magento\ConfigurableProduct\Block\Adminhtml\Product\Edit\Button\Save::getSaveAction()

2.

3.

4.

1. `Magento\ConfigurableProduct\Block\Adminhtml\Product\Edit\Button\Save::getSaveAction()`