2

In Magento 2 when create new customer, there is address tab and when i click new address there is a js running that render the address field, but i don't know which one, i want to extend that js so i can insert my custom function from my extension,

Here's the figure of add new address and inspect element:

enter image description here

when i click add new address there are 2 files which triggered by js, and i want to know what js that calls them

EDIT

i've tried add mixin, requirejs-config.js:

var config = {
    config: {
        mixins: {
            'Magento_Ui/js/form/components/collection': {
               'NamespacE_Module/js/form/components/collection-mixin': true
            }
        } 
};

collection-mixin.js :

    /**
 * Copyright © 2016 Magento. All rights reserved.
 * See COPYING.txt for license details.
 */
define([
    'jquery',
    'mage/utils/wrapper'
], function ($, wrapper) {
    'use strict';
    return function(collection){
        var newFunction = collection.addChild;
        var newFunction = wrapper.wrap(newFunction, function(original){
            //do extra stuff
            console.log('before');
            //call original method
            var result = original();
            console.log('after');
            //do extra stuff

            //return original value
            return result;
        });

        collection.addChild = newFunction;
        return collection;
    };

});

the function i want to add is after addChild function which is the original function from collection.js

1
  • is it working??
    – Bojjaiah
    Feb 21, 2017 at 12:28

1 Answer 1

1

you can override Magento_Ui/js/form/components/collection.js file in your Module.

and your requirejs-config.js file should be below

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

    var config = {
        map: {
            '*': {
                'Magento_Ui/js/form/components/collection':'[Namespace]_[VendorName]/js/form/components/collection'
            }
        }
    };

in your collection.js file and update below code.

sayHello:function(){
            alert('simple guy')
        },

        /**
         * Creates new item of collection, based on incoming 'index'.
         * If not passed creates one with 'new_' prefix.
         *
         * @param {String|Object} [index] - Index of a child.
         * @returns {Collection} Chainable.
         */
        addChild: function (index) {
            this.childIndex = !_.isString(index) ?
                'new_' + this.lastIndex++ :
                index;

            layout([utils.template(childTemplate, this)]);

            this.sayHello();

            return this;
        },

after completing this,

you need to remove pub/static/adminhtml/ and pub/static/_requirejs/adminhtml/.

and run the php bin/magento setup:static-content:deploy command.

finally open one of customer page try to click on Add NewAddress.

let me know if you have any info.

17
  • when i click the add new address button i got this error [Namespace]_[VendorName]/js/form/components/collection/item.js 404 (Not Found)
    – simple guy
    Feb 21, 2017 at 7:10
  • @simpleguy can you post your code so that we will find where you went wrong.
    – Bojjaiah
    Feb 21, 2017 at 7:17
  • i just copy the entire collection.js, i think the problem is in requirejs-config, because in the same folder with collection.js there is a folder named collection which contain item.js inside
    – simple guy
    Feb 21, 2017 at 7:24
  • @simpleguy Hmmm please update your question with your code. Other wise we can't help.
    – Bojjaiah
    Feb 21, 2017 at 7:26
  • see my updated question
    – simple guy
    Feb 21, 2017 at 7:42

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.