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

  • is it working?? – Bojjaiah Feb 21 '17 at 12:28
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.

| improve this answer | |
  • 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 '17 at 7:10
  • @simpleguy can you post your code so that we will find where you went wrong. – Bojjaiah Feb 21 '17 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 '17 at 7:24
  • @simpleguy Hmmm please update your question with your code. Other wise we can't help. – Bojjaiah Feb 21 '17 at 7:26
  • see my updated question – simple guy Feb 21 '17 at 7:42

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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