I want to find where JS is written for data-action="add-to-wishlist" in Magento 2

I saw add-to-wishlist and data-action many times and on research I found the action in this file Mageto_Wishlit/js/addtowishlist.js

Here is a widget with two functions as below.

bindFormSubmit: function () {
    var self = this;

    $('[data-action="add-to-wishlist"]').on('click', function (event) {
        var element, params, form, action;
    alert("Hi I am Here");

        element = $('input[type=file]' + self.options.customOptionsInfo);
        params = $(event.currentTarget).data('post');
        form = $(element).closest('form');
        action = params.action;

        if (params.data.id) {
            $('<input>', {
                type: 'hidden',
                name: 'id',
                value: params.data.id

        if (params.data.uenc) {
            action += 'uenc/' + params.data.uenc;

        $(form).attr('action', action).submit();


_updateAddToWishlistButton: function (dataToAdd) {
    var self = this;

    $('[data-action="add-to-wishlist"]').each(function (index, element) {
        var params = $(element).data('post');
        alert("Hi I am Here");

        if (!params) {
            params = {
                'data': {}

        params.data = $.extend({}, params.data, dataToAdd, {
            'qty': $(self.options.qtyInfo).val()
        $(element).data('post', params);

I have tried to interupt these two events by adding alert but I'm not getting any success on this.

  • Did you compile after your change? Also, is the spelling correct of that path Mageto_Wishlit/js/addtowishlist.js
    – Gezzasa
    Commented Nov 22, 2019 at 12:06
  • yes i tried couple of times but its not working
    – User 69
    Commented Nov 22, 2019 at 12:09
  • And the spelling of the path to the JS file?
    – Gezzasa
    Commented Nov 22, 2019 at 12:25
  • it is not in m code i just added the path of file i must not have to matter
    – User 69
    Commented Nov 22, 2019 at 12:27

1 Answer 1


You should take a look at vendor/magento/magento2-base/lib/web/mage/dataPost.js

postTrigger: ['a[data-post]', 'button[data-post]', 'span[data-post]'],

When clicking those element types, it will trigger a post action.

For this file Mageto_Wishlit/js/addtowishlist.js, I don't dive depth yet. But, we can see the options:

options: {
    bundleInfo: 'div.control [name^=bundle_option]',
    configurableInfo: '.super-attribute-select',
    groupedInfo: '#super-product-table input',
    downloadableInfo: '#downloadable-links-list input',
    customOptionsInfo: '.product-custom-option',
    qtyInfo: '#qty'

This file will affect bundle, configurable, grouped, downloadable products and custom options.

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.