Add To Cart Button in repeater solution

Ask the community
, ,
1

Hi forum! We are currently working on our product page (theproducerschool.com/packs) and we are using a custom repeater to showcase our products.

We have added the following code to let the buttons in the repeater function as an add to cart button:

$w.onReady( function () {
$w( “#addToCart” ).onClick((event) => {
let $item = $w.at(event.context);

let selectedProduct = $item( ‘#dataset4’ ).getCurrentItem();
let productId = selectedProduct._id;
$w( ‘#shoppingCartIcon1’ ).addToCart(productId)
.then(() => {
console.log( “add product ${productId} success” );
})
. catch ((error) => {
console.log(error);
});

});

First, this all worked perfectly. But once I added some new products, the store/product dataset is now causing the buttons to only add 1 product to the cart, instead of a different one for every product. Can anybody help me with this? It would be highly appreciated :slight_smile:

2

When I click on many of the items, I get a “product not found” error. Some items are successfully added to the cart.

1156×858 185 KB

I doubt this matters, but the only code you need in the dataset onReady() function is the call to the function count() . All of the other code, including the function count() itself, should be moved out of the dataset onReady() into the page’s onReady().

You seem to have some sort of issue with your products. I would suggest checking them in your Store dashboard to make sure that they have been properly entered.

3

Would you know what could be the cause? It seems like all of the products are succesfully added, unless the 2 newest on the page.

4

How many products are added? Perhaps the dataset is limited to a certain number?