Creating a Shopping Cart with the Data Store Component

Docs Cookies, Sessions and Local Storage
#21

Great tool and great tutorial, indeed!

Now I have a question: how to represent the same product in a single line with just the quantity being increased when the ‘Add to cart’ button for the same product is clicked more than once?

image
image804×342 13.7 KB

#22

Well, use the upsert functionality as explained in the tutorial.

#23

Huh? Not sure I understand what you mean Teodor :slight_smile:

#24

Well, follow the tutorial it’s explained how to do exactly:

#25

I made the page following the tutorial. But, let me read it again to see. I may be missing some steps.
Thanks!

#26

Ok. After reviewing the tutorial, I found one of my mistake and now the same product is not being duplicated. However, the quantity does not increase when the ‘add to cart’ button is pressed for the same product…
I believe to increase the quantity it has to be done manually, is this the expected behavior?

#27

As I explained earlier - use the upsert functionality and update the quantity.
Everything is already explained in the tutorial.

#28

I am following the tutorial and I am using the upsert. Trust me on that :smiley:

Quantity is just not updated at all. And the value is displayed correctly only if I use quantity + 1 (without the backticks).

image
image362×631 8.68 KB

And also, I have noticed that when trying to edit the upsert I have to add it again before it can be editable. (that’s another topic)

#29

The shopping cart is working very well, but how to record the data from shopping cart to my database?
I created a form with a repeat, using the Data Store as expression, but on Server Connect, the repeat is not imported as an array and I can’t use multi insert query… I’m stuck on it! HELP!

#30

Are you using a hidden form input?

#31

Hey Max! Thanks! Yes!!

<div id="record" is="dmx-repeat" dmx-bind:repeat="cart.data">
		<input id="txtProductId" name="product_id" type="hidden" dmx-bind:value="product_id">
		<input id="txtProductName" name="product_name" type="hidden" dmx-bind:value="product_name">
		<input id="txtPrice" name="price" type="hidden" dmx-bind:value="price">
		<input id="txtQuantity_cart" name="quantity" type="hidden" dmx-bind:value="quantity">
   </div>
1 Like
#32

I’ve just replied to your thread

1 Like
#33

Hello Teodor,
you don’t show the demo of your shopping cart - do you?

#34

Hi and welcome, have a look at

#35

I followed the tutorial and created a checkout page that works just fine. When I to insert the records from my checkout page into the database the first record in the array is duplicated and the rest of the information is lost. I’m sure I have done something silly but I cant seem to figure it out. Anybody got an idea that I could try?

thank you

#36

Maybe this will help:

image
image1393×588 89.5 KB

#37

Not sure, it does not look anything like my code. Here is mine perhaps that will give a clue

image
image1982×419 109 KB

I am not sure if I am placing the datastore values in the correct place versus the values to be inserted into the table I call

#38

You have not supplied a value for all of the input fields. The value is obtained from the cart.data repeat and should look similar to dmx-bind:value="quantity"

#39

Thank you Ben. I’ll give it a go today.

Daniel Bell, PhD
CMoN Gourmet Treats
Founder and CEO

#40

So, I am going to bed now but it is my mission to tackle this tutorial again in the morning. One issue I can see popping up is that using local storage it is possible that items that should no longer be available because the date of the show has passed.

So I think this is where I need to compare the cart to the database? How is that done?