Blog

extend jQuery widget in magento 2.x

ikodes-technology-design

Extend jQuery widget in magento 2: In this blog we will see how we can extend magento jQuery widget. We can extend jQuery widgets by using mixins.

In java script mixin is a class whose methods are added to, or mixed in, with another class.

In order to extend jQuery widget first we need to declare a mixin in requirejs-config.js file like below.

var config = {
    config: {
        mixins: {
            'Vendor_ParentModule/js/super': {
                'Vendor_ChildModule/js/child': true
            }
        }
    }
};


Now for example parent widget(Vendor_ParentModule/js/super) is like below
define([
    "jquery",
], function ($) {
    "use strict";
    $.widget("mage.customWidget", {
        _create: function() {
            this.foo();
        },
        foo: function() {
            console.log("ikodes class");
        }
    });
    return $.mage.customWidget;
});
Then in child widget(Vendor_ChildModule/js/child) we can override it’s method like below
define([
    'jquery'
], function ($) {
    'use strict';
    var widgetMixin = {
        foo: function() {
            console.log("do your stuff...");

            return this._super(); // parent method will be called by _super()
        }
    };
    return function (parentWidget) {
        $.widget('mage.customWidget', parentWidget, widgetMixin);
        return $.mage.customWidget;
    };
});

 

Related Posts


November 21, 2019

Top 10 Business Website Ideas which you can make under 1000+ USD

This Present time is known as the computerized period in light of the fact that in the present occasions each assistance is going on the web, Which implies now individuals can get to any help through an online stage. The fundamental prerequisite of utilizing an online assistance is a cell phone and a web association.

October 12, 2019

History of WordPress

Would you like to think about the historical backdrop of WordPress? On the off chance that you are beginning a WordPress blog or site today, at that point you see a prevalent web designer which fueled over 32% of all sites on the web. In this article, we need to investigate the historical backdrop of