Unavailable Product And Ajax-Cart.js

[jcuenin]

Hello everyone,

 

I am trying to create a function that will allow to display a different fancybox if the product added to the cart is not available. This Fancybox should contain a suggestion of products in the same category.

 

My question is : how can I get in javascript the list of products that are in the same category of the product?

 

I guess I should use an ajax request but I don't know how to.

 

Here is what I did so far :

 

I started by modifying product.tpl to add "indisponible" if the quantity is under 1.

<select name="{$groupName}" id="group_{$id_attribute_group|intval}" class="form-control attribute_select no-print {$group.name}">
														{foreach from=$group.attributes key=id_attribute item=group_attribute}
															<option value="{$id_attribute|intval}"{if (isset($smarty.get.$groupName) && $smarty.get.$groupName|intval == $id_attribute) || $group.default == $id_attribute} selected="selected"{/if} title="{$group_attribute|escape:'html':'UTF-8'}">
                                                                                                                            {$group_attribute|escape:'html':'UTF-8'}
                                                                                                                <!-- jcuenin - 08012016 - ajoute out ot stock dans le dropdown -->                                                                                                                        
                                                                                                               {if {$group.attributes_quantity[{$id_attribute|intval}]} < 1}
                                                                                                                   - {l s='indisponible'}
                                                                                                               {/if}
                                                                                                                        </option>
														{/foreach}
													</select>

Then, I modified the ajax-cart.js file with the following.

$(document).off('click', '#add_to_cart button').on('click', '#add_to_cart button', function(e){
				e.preventDefault();
                                // jcuenin - modification ajout panier pour produits indisponibles
                                console.log("produit ajouté au panier");
                                
                                var indisponible = jQuery('#group_4 option:selected').text();
                                if( indisponible.indexOf('indisponible') >= 0){
                                    ajaxCart.showAvailable($('#product_page_product_id').val(), $('#idCombination').val(), true, null, $('#quantity_wanted').val(), null);
                                }
                                else{
                                    ajaxCart.add($('#product_page_product_id').val(), $('#idCombination').val(), true, null, $('#quantity_wanted').val(), null);
                                }
			});

// jcuenin - modification ajout panier pour produits indisponibles
	showAvailable : function(idProduct, idCombination, addedFromProductPage, callerElement, quantity, whishlist){
            $.fancybox.open([
                {
                    type: 'html',
                    topRatio: 0,
                    minHeight: 30,
                    content: '<div style="height:200px;width:100%;">Le produit '+idProduct+' est indisponible</div>'
                }], 
                {
                padding: 0
            });
            
        }

Thank you in advance for your help and have a good day,

 

Best regards,

 

Julien