Access JS Function from Another JS File in Magento 2

javascriptknockoutjsmagento2

I'm trying to access a function from 'create-validation-list.js'.

define([
'jquery'
], function ($) {

return createValidationList = function () {
// Code
}

shipping.js

define([
'jquery',
'underscore',
'Magento_Ui/js/form/form',
'ko',
'Magento_Customer/js/model/customer',
'Magento_Customer/js/model/address-list',
'Magento_Checkout/js/model/address-converter',
'Magento_Checkout/js/model/quote',
'Magento_Checkout/js/action/create-shipping-address',
'Magento_Checkout/js/action/select-shipping-address',
'Magento_Checkout/js/action/create-billing-address',
'Magento_Checkout/js/action/select-billing-address',
'Magento_Checkout/js/model/shipping-rates-validator',
'Magento_Checkout/js/model/shipping-address/form-popup-state',
'Magento_Checkout/js/model/shipping-service',
'Magento_Checkout/js/action/select-shipping-method',
'Magento_Checkout/js/model/shipping-rate-registry',
'Magento_Checkout/js/action/set-shipping-information',
'Magento_Checkout/js/model/step-navigator',
'Magento_Ui/js/modal/modal',
'Magento_Checkout/js/model/checkout-data-resolver',
'Magento_Checkout/js/checkout-data',
'uiRegistry',
'mage/translate',
'BB_Checkout/js/action/create-validation-list',
], function (
$,
_,
Component,
ko,
customer,
addressList,
addressConverter,
quote,
createShippingAddress,
selectShippingAddress,
createBillingAddress,
selectBillingAddress,
shippingRatesValidator,
formPopUpState,
shippingService,
selectShippingMethodAction,
rateRegistry,
setShippingInformationAction,
stepNavigator,
modal,
checkoutDataResolver,
checkoutData,
registry,
$t,
createValidationList
) {
'use strict';

    return Component.extend({
     // other code

    /**
     * Set shipping information handler
     */
    setShippingInformation: function () {
        createValidationList.createValidationList();

        if (this.validateShippingInformation() && this.validateBillingInformation()) {
            setShippingInformationAction().done(
                function () {
                    stepNavigator.next();
                }
            );
        }

        $('#customer-email').on('keyup', createValidationList.createValidationList);
    }
});
});

I'm getting the error createValidationList is not a function.

Best Answer

Try writing it like this:

var createValidationList = function () {
    // Code
}

return {
    createValidationList: createValidationList
};

This is how I achieved this in the past. You can export more functions this way too, for example:

return {
    createValidationList: createValidationList,
    anotherFunction: anotherFunction,
    aThirdFunction: aThirdFunction
};
Related Topic