2

I don't seem to be able to extend quick search module widget form-mini.js found in module/path: ../vendor/magento/module-search/view/frontend/web/form-mini.js

How can I extend in my custom module $.mage.quickSearch Widget?

Already tried in Vendor_Module/js/search:

define([
    'jquery',
    'underscore',
    'mage/template',
    'matchMedia',
    'jquery/ui',
    'mage/translate',
    'mage/menu'
], function($){

    $.widget('custom.quickSearch', $.mage.quickSearch', {
        _init: function () {
            alert("I'm here");
        }
    });

    return $.custom.quickSearch;
});

in requirejs-config.js

var config = {
    "map": {
        "*": {
            "quickSearch": "Vendo_Module/js/search"
        }
    }
};

I've previously successfully extended $.mage.menu Widget using the same technic as above but struggling with quick search does anyone know? help appreciated!

  • Are you facing any issue? – Rutvee Sojitra May 28 at 8:46
  • @RutveeSojitra the error was Uncaught TypeError: base is not a constructor – Juliano Vargas May 28 at 9:03
1

The best practice is to use mixins way with the full path of js.

app/code/Vendor/Module/view/frontend/requirejs-config.js

var config = {
    config: {
        mixins: {
            'Magento_Search/form-mini': {
                'Vendor_Module/js/mixins/form-mini': true
            }

        }
    }
};

app/code/Vendor/Module/view/frontend/web/js/mixins/form-mini.js

define([
    'jquery',
    'underscore',
    'mage/template',
    'matchMedia',
    'jquery/ui',
    'mage/translate'
], function ($, _, mageTemplate, mediaCheck) {

    return function (widget) {
        $.widget('custom.quickSearch', widget, {
            _init: function () {
                alert("I'm here");
            }
        });
        return $.custom.quickSearch;
    };
});

enter image description here

  • Never used mixins before that is exactly what I need to know it works! – Juliano Vargas May 28 at 9:01

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.