SIMPLE ASP.NET SHOPPING CART

Hey All,

In this blog post i will explain to you how to create a very simple shopping cart by using a Data Table with C#. First of all you have to understand the main functionality in a shopping cart. I will explain to you in this blog how to,

1. Create a cart using a data table.
2. Add Items to the cart.
3. Viewing the cart.
4. Delete Items from the cart.

Creating the Cart

              The Shopping cart that I'm going to explain is based on a Air Ticket Reservation System which I did for my 1st year University project. Since a shopping cart is needed for each and every member of your site it is advisable to create the shopping cart when a user logs in to the site.
Here is how you can create the shopping cart for each user in the logging event of your website.

Here what is happening is that I'm creating a Data Table called cartData and adding the necessary columns to the Data Table. After creating the table finally I'm adding the table to a Session called "cartDetails" so that I can access my shopping cart from the Session when the user wants to add some item to the cart.

Adding Items to the Cart

        The next thing we want to do is to add items to the cart that we created.

 

Here what I'm going to do is that when the user clicks on the Add To Cart link the details that is shown in the Grid View will be added to the Cart that we created.

First I'm creating a array of type Object to hold the values in the Grid View and a Data Table to hold my shopping cart temporarily.

        object[] values; 

        DataTable cartTable;

Here First I'm declaring a array called values of type object. The values array will  hold the values in the Grid View temporarily.

          According to my website I'm allowing the visitors as well as registered members to search flight details. But when they try to to click on the Add To Cart link it will check whether the user has logged in or not. If he is not logged in he will be redirected to the log in page. I'm checking that by using a Session "LoggedIn".

          If the user is logged in, then I'm dynamically creating the values array. The size of the values array is the number of columns in my Grid View. After that I'm adding the data in the Grid View to my values array one by one by using the for loop.

          I added my shopping cart to a Session when the user logged in to the site. So in order to add details to the cart i can get the shopping cart from the Session. Since my cart is a Data Table I'm storing the reference to the shopping cart in the cartTable variable that I created.

cartTable = (DataTable)Session["cartDetails"];

         Then I can add data to the cart by using the Rows.Add() method by passing the values array as the parameter. Then the data will be added to the shopping cart.

cartTable.Rows.Add(values);

   

     Finally add the shopping cart back to the Session.

Session["cartDetails"] = cartTable;

 Viewing the Cart

     OK. Now I have added Items to the Cart. The next thing is to view the cart.

        

Here I'm using a Grid View to view  the Cart details to the user. Here I'm setting the AutoGenarateDeleteButton Property of the Grid View to True so that it will be easier for us to implement the delete method for the cart.

Here I'm getting the cart from the Session and storing it in a Data Table type variable called table.

table = (DataTable)Session["cartDetails"];

Then the total amount of the cart is calculated by using the loop. The I'm setting the Data Source of my Grid View to the Data Table table and binding the data to the Grid View.

GridView1.DataSource = table.DefaultView;

GridView1.DataBind();

Finally the total amount of the cart is displayed in a Text Box.

Delete Items from the Cart

     Since we set the AutoGenarateDeleteButton Property of the Grid View to True, you can see a Delete link in every row of the Grid View. We can use this link to remove items from the cart.

     Double click on the RowDeleting event of the Grid View. Here you can write the code to happen when the user click on the Delete link of a row. In our case we want to delete that item from our cart.

Here what is happening is that before I remove the row from the cart I'm getting the price, in my case the price of the ticket and reducing it from the total value of the cart and displaying it to the user by using the Text Box.

   I can get the index of the row that the user is trying to delete by using e.RowIndex .By using the row index I can easily delete the row from the cart by calling the Rows.Delete() method.

table.Rows[e.RowIndex].Delete();

table is  a variable of type Data Table that we created in the View cart stage. It has the reference to our cart. The above code deletes the record at the given row index.
After deleting the row add the cart back in to the Session as we did in the adding items to the cart stage.

Session["cartDetails"] = table;

To view the changes to the cart that the user made, set the Data Source of the Grid View back to the table and bind the data back. You can check whether the user has deleted all the rows by using,

if (table.Rows.Count==0)

condition and print the proper message to the user.

That's about it on how to create a simple ASP.Net shopping cart. Hope you'll will find my blog interesting.
Thanx.
Please leave you valuable comments....