Get an action when you change product combination on product page

Get an action when you change product combination on product page – Front End. As prestashop has changed this time itself drastically whether we talk about the design point of view or code point of view. They have introduced symfony in its new released as we all know.

This blog will let you get the action like retrieving the id_product_attribute or other information related to the product on product detail page when some change change the attribute or combination of the product. As prestashop has minified JS file into a common file core.js, in which almost all code of js has been written and compressed… So its difficult to override any event of core.js

By this post, you will get a way to retrieve event like getting product attribute id or other information related to product while changing the combination of product on product page.

$(function() {
    $(document).on('change', '.product-variants [data-product-attribute]', function (event) {
        var query = $(event.target.form).serialize() + '&ajax=1&action=productrefresh';
        var actionURL = $(event.target.form).attr('action');
        $.post(actionURL, query, null, 'json').then(function (resp) {
            var productUrl = resp.productUrl;
            $.post(productUrl, {ajax: '1',action: 'refresh' }, null, 'json').then(function (resp) {
                var idProductAttribute = resp.id_product_attribute;

                // your own code to perform some action on combination change
                //
                //

            });
        });
    });
});

Lets understand the code written in above block :-

On DOM load we have used click event of jquery, when combination change event perform by customer, then we can get this event in

$(document).on('change', '.product-variants [data-product-attribute]', function (event) {

Now, we have created one URL

        var actionURL = $(event.target.form).attr('action');

var actionURL, will be pass in post request for making querying from the server.

$.post(actionURL, query, null, 'json').then(function (resp) {

in the above code, we have used post method of jquery which help us to make a return of product information containing all the related information like product quantity, product attribute and its ID and so on. All the information can be retrieved by the resp variable. Like if you need to have product id attribute then you can use var idProductAttribute = resp.id_product_attribute ………..

Hope, it will make some points clear to you…..
For any doubt, you can ask by commenting on this blog below 🙂 🙂

Deepak 4 Badges

I love the web. Coding is my passion and love the learn new technologies.

• 16 Dec, 2016
  Created by - Deepak