Add cart Javascript Ajax in product rows inside html table not working

[st08147]

Hi All,

I don't have a lot of experience in Jquery and PHP but I'm trying the achieve to change list of products page in order to be shown as a table.

First of all, I modified the list of products as a list (not grid), after that I modified the file product.tpl of "prestashop_1.7.3.0\themes\classic\templates\catalog\_partials\miniatures" folder adding the following code (I've followed a post explaining how and where add this code) to add a cart button and quantity selector in order to offer the user to add to cart from the list of product page:

            <div class="clearfix atc_div">
                <input name="qty" type="text" class="form-control atc_qty" value="1" onfocus="if(this.value == '1') this.value = '';" onblur="if(this.value == '') this.value = '1';"/>
                <button class="add_to_cart btn btn-primary btn-sm" onclick="mypresta_productListCart.add({literal}$(this){/literal});">
                    <i class="material-icons">add_shopping_cart</i>{l s='Add to cart' d='Shop.Theme.Actions'}
                </button>
            </div>

Second, I tried to put the product information (product name, product description, price, quantity and cart) inside a row (<tr>) of a table (<table>) in order to shown all these information horizontal align instead of vertical. The information is shown as I want but the problem is that when I put the above code inside a table the block-cart modal (pop-up) is launched empty (without product information and thumbnail).

When I leave the code without put it inside a table the block-cart modal pop-up is lauched correctly with product information.

 

Could you help with that issue?

 

Best regards,

Marc

Edited June 15, 2018 by st08147 (see edit history)