Sign In/My Account | View Cart  
advertisement


Listen Print Discuss

Building E-Commerce Sites with Handel
by Christopher H. Laco | Pages: 1, 2, 3, 4, 5

The Shopping Cart

The shopping cart code base includes the usual actions: add, update, delete, and empty, as well as the ability to save the cart's contents and restore a saved cart back into the current cart. To try it out, you need to add something to the cart!

Download the test products page and load it in a browser of your choice (Figure 2).

Product Page Screenshot
Figure 2. The product page

Once you load the page, pick a hot new product and click Add To Cart (Figure 3). By default, the product's page points to http://localhost:3000/cart/. You may have to alter the page's contents to match the address of the MyStore server.

Shopping Cart Page Screenshot
Figure 3. The shopping cart page

Save this cart. Hit the Save Cart button and leave the field next to it blank.

Cart Save Error Screenshot
Figure 4. The shopping cart with an error

Take note of the error at the top of the page in Figure 4--"The Name field is required to save a cart." The code and template generated by Handel uses Data::FormValidator and HTML::FillInForm where appropriate. Not only didn't you have to write any cart code, you didn't have to write and forms validation code either!

Go ahead and enter a name for your saved cart and hit Save Cart again. If all goes well, Handel saves the shopping cart's contents into a list under the name specified in the Name field. To view the list of saved shopping carts, click View Saved Carts at the top of the page (Figure 5).

Saved Carts Screenshot
Figure 5. Viewing saved carts

When restoring wish lists, there are three options: Append, Merge, and Replace. As the titles imply, Append simply adds the saved cart items to the current cart. There is no attempt made to prevent duplicate parts. Merge adds the saved cart's contents into the current cart. If it finds a part with the same identifier, it adds the quantity of the two parts together. Replace empties the current cart and them restores the saved cart's contents.

Because the cart is currently empty, select any of those methods and hit Restore Cart. You should be back at the cart page with your cart items restored.

Pages: 1, 2, 3, 4, 5

Next Pagearrow