Preоrder Status for Products on Category Pages

“Preorder available” Status for Products on Category Pages in Prestashop

In this article I will describe how to add the status “Preоrder available” to a category page using the module Prestashop Pre-order and Waiting list. We are unable to include this feature into the module by default because older versions of Prestashop do not allow hooks for catalog pages. Also, we do not want to replace the product-list.tpl file completely as some other developers do because this has been proven a bad practice: quite often a template may contain certain modifications, so if you completely replace it this may cause problems with markup. I would also like to apologize that we did not include this chapter into the user guide, so some of our clients got confused when they did not see the status appear on the page as shown on the demo:

Use the js-function “overrideButtonsInTheList” to place the status in a category page.

overrideButtonsInTheList : function(){
      if ($('#product_list .ajax_block_product').length > 0){
            var id_product_pp=[];
            $('#product_list .belvg_pp_product').each(function() {
                id_product_pp.push($(this).val());
            });

            var form_data = 'ajax=1&id_products='+JSON.stringify(id_product_pp);
            $.ajax({
                url: baseDir + 'modules/belvg_preorderproducts/controllers/AjaxController.php',
                data: form_data+"&action=checkPPExists",
                type: "POST",
                async: false,
                success: function( jsonArray ) {
                    var dataArray = JSON.parse(jsonArray);
                    console.log(dataArray);
                    for(var i=0; i<dataArray.length; i++) {
                        $("#belvg_pp_product_"+dataArray[i]).parent(".ajax_block_product").find(".price").append('<p class="pp_available_home">'+belvg_pp_str2+"</p>");
                    }
                }
            });
        }
},

overrideButtonsInTheList : function(){

if ($('#product_list .ajax_block_product').length > 0){

var id_product_pp=[];

$('#product_list .belvg_pp_product').each(function() {

id_product_pp.push($(this).val());

});

var form_data = 'ajax=1&id_products='+JSON.stringify(id_product_pp);

$.ajax({

url: baseDir + 'modules/belvg_preorderproducts/controllers/AjaxController.php',

data: form_data+"&action=checkPPExists",

type: "POST",

async: false,

success: function( jsonArray ) {

var dataArray = JSON.parse(jsonArray);

console.log(dataArray);

for(var i=0; i<dataArray.length; i++) {

$("#belvg_pp_product_"+dataArray[i]).parent(".ajax_block_product").find(".price").append('<p class="pp_available_home">'+belvg_pp_str2+"</p>");

}

});

}

To make this feature work properly you need to edit the file product-list.tpl and insert the element with id=” belvg_pp_prоduсt_{id_prоduсt}” before the closing tag </li>

Partner With Us Let's discuss how to grow your business. Get a Free Quote.

Talk to Andrey

...
</div>
            <input type="hidden" name="belvg_pp_product" class="belvg_pp_product" id="belvg_pp_product_{$product.id_product}" value="{$product.id_product|intval}" />
</li>
...

...

</div>

</li>

...

To display this status on the homepage there is the js-function “overrideButtonsInTheHome” in the module homefeatured.

overrideButtonsInTheHome : function(){
           if ($('#featured-products_block_center .ajax_add_to_cart_button').length > 0){
            var id_product_pp=[];
            $('#featured-products_block_center .belvg_pp_product').each(function() {
                id_product_pp.push($(this).val());
            });

            var form_data = 'ajax=1&id_products='+JSON.stringify(id_product_pp);
            $.ajax({
                url: baseDir + 'modules/belvg_preorderproducts/controllers/AjaxController.php',
                data: form_data+"&action=checkPPExists",
                type: "POST",
                async: false,
                success: function( jsonArray ) {
                    var dataArray = JSON.parse(jsonArray);
                    console.log(dataArray);
                    for(var i=0; i<dataArray.length; i++) {
                        $("#belvg_pp_product_"+dataArray[i]).parent(".ajax_block_product").find(".price").append('<p class="pp_available_home">'+belvg_pp_str2+"</p>");
                    }
                }
            });
        }
},

overrideButtonsInTheHome : function(){

if ($('#featured-products_block_center .ajax_add_to_cart_button').length > 0){