I am trying to create a custom product page with dynamic pages. I ideally want the user to be able to click a button and add that product to their cart without being routed to Wix's pre-built product page. I am trying to code a normal button to make it work.
I am new to Velo and javascript. I have researched a lot and no code that I have found in this forum has worked yet. Below are the codes that I have found/tried:
Attempt #1
import wixData from 'wix-data';
export function dynamicDataset_ready(){let product =$w('#dynamicDataset').getCurrentItem();$w('#atcButton').onClick(()=>{$w('#shoppingCartIcon1').addToCart(product._id);
})}
Attempt #2
import wixData from 'wix-data';
export function addToshoppingCartIcon_click(event, $w) {
const productId = $w('#dynamicDataset').getCurrentItem()._id;
$w('#shoppingCartIcon1').addToCart(productId, 1, );
}
Attempt #3
export function button1_click(event) {
const productId = $w('#dynamicDataset').getCurrentItem()._id;
$w('#shoppingCartIcon1').addToCart(productId);
}
I have tried a few other codes as well, but these seem the most promising based on others comments and my very basic knowledge of the code. Any help would be great!
Hello Everyone,
I new to Java, I m stuck since 5 days trying to fix an issue.
I have two dynamic page, One is for the Customer, Second is product registered by the clients. I create a reference in my dynamic product collection in relation to each Customer.
I m looking to add a Cart in order for my site visitor to add to card by a simple click . but it does not work. Here is my code
import { cart } from 'wix-stores'; export function AddToCart_click_1(event) { const product = $w('#dynamicDataset').getCurrentItem(); const idproduct = product.multireference;
cart.addProducts(idproduct) .then((shoppingCartIcon1)=>{ // Products added to cart const cartId = shoppingCartIcon1._id; const cartLineItems = shoppingCartIcon1.lineItems; }) .catch((error)=>{ console.log(error); }) }
it tells me onclick cant be added to shopping cart icon .... do i need to add custom icon too?
Hi Kath,
Hi All,
I have a dynamic page, which is not a dynamic product page, where I also want to add a ´add to cart´button. The product are refferenced in my datasheet. any Idea how to modify the above code?
Thanks,
Jur
Hi Ryan!
I managed to find a solution that works for me, check below. Maybe it'll work for you too.
This code adds '1' of the current item to the cart and the sidebar 'minicart' pops out.
import { cart } from "wix-stores"; import { formFactor } from 'wix-window'; $w.onReady(function () { let productData = $w("#dynamicDataset").getCurrentItem() let productId = productData._id let quantity = 1 let product = [{ "productId": productId, "quantity": quantity }] $w("#cartButton").onClick( (event) => { cart.addProducts(product) .then(() => { // Only show the Mini Cart if the site is not being viewed on mobile if (formFactor !== "Mobile") { cart.showMiniCart(); } }) .catch((error) => { console.error(error); }); }); })
Velo changed the code you want to use, it is already deprecated.
Try this:
import { cart } from "wix-stores" $w("#shoppingCartIcon1").onClick(async () => { const productId = $w("#dynamicDataset").getCurrentItem()._id const addToCart = await cart.addProducts(createProductObj(productId, 1)) addToCart._id ? console.log("Cart Updated!") : console.log("Something is wrong!") }) function createProductObj(id, qtd) { return [ { productId: id, quantity: qtd, }, ] }
Hi Ryan!
I don't have an answer for you. I just wanted to add that I've been having the same problem and I can't fix it either. I'm trying to create a custom product page using dynamic pages but I can't get 'add to cart' to work at all.
Crossing my fingers that someone will know what to do.