Problem with getting product details to Add to Cart

Ask the community
, ,
1

I’m currently building a website which includes a store and i need to use code to add the product to the cart instead of using the implemented Add To Cart button.
That is because i need users to enter way more product details than wix allows. Users enter the required details in regular text inputs, so i need to just put the user entered details into a “details” custom text field in the product before adding it to the cart just for user conformation. Also, i need to retrieve the "size’ that the user chose for the product (which is a regular field in my product)
I’ve been trying out some stuff but face errors such as “TypeError: $w(…)getProduct is not a function”
N.B. I’m new to this language
Thanks in advance

2

If you don’t want to use the standalone add to cart button from Wix Stores, then you can look at using CartIcon and addToCart.
https://support.wix.com/en/article/adding-and-setting-up-a-standalone-add-to-cart-button

https://www.wix.com/corvid/reference/$w.CartIcon.html

3

hey GOS
I’ve looked at all of this before.
My problem is how to get the user choices to be able to add them to the product in the addToCart()

1064×738 242 KB

This is the product
The only field that is in the product is “Size”. The rest are normal inputs
What i want to do is retrieve the chosen size and use it as an option in addToCart()
How do I do That?

4 
export function button2_click(event) {
    $w("#shoppingCartIcon1").addToCart("ed54fc18-48df-5bb9-cd99-428bfbe0c4f0")
        .then( () => {
        console.log("Product added");
        } )
        .catch( (error) => {
        console.log(error);
        } );
}

I’m trying this code but i get the error message:
“TypeError: $w(…).addToCart is not a function”

5

With your code issue, check the id of the cart icon as it should be #myShoppingCartIcon or #myShoppingCartIcon1 etc.

$w("#myButton").onClick( () => {
  $w("#myShoppingCartIcon").addToCart("ea77f230-558f-0ba565e8f827")
    .then( () => {
      console.log("Product added");
    } )
    .catch( (error) => {
      console.log(error);
    } );
} );
6

As for other inputs, as shown in add products to cart, you can see how to add multiple products
https://www.wix.com/corvid/reference/$w.CartIcon.html#addProductsToCart

Plus in the add to cart section it does give you an example of adding product options, you might have to scroll down a little bit to see it.
https://www.wix.com/corvid/reference/$w.CartIcon.html#addToCart

Also, further down that API section, you will find the parts for options and custom text fields.
https://www.wix.com/corvid/reference/$w.CartIcon.html#AddToCartCustomTextField
https://www.wix.com/corvid/reference/$w.CartIcon.html#AddToCartItem
https://www.wix.com/corvid/reference/$w.CartIcon.html#AddToCartOptions

You will need to add your own choices to it and make sure that they match as stated in the info for it.

Product options to use when adding the product to the cart. The object contains key:value pairs where the key is the option name and the value is the chosen option value.

7

Hey GOS
Can I have you try the addToCart() out in my website and tell me if it works?
I’ve tried a lot and it gives the $w(…)addToCart is not a function error.
Tell me what permissions to change to have you try
Thanks

8

That error is caused by a limitation in Preview mode, open the developer tools on Google Chrome and test your page on the live website, there’s a console there that gives you everything that is expected to be logged.