ASP.NET MVC Shopping Cart with C#, EF, SQL Server-Part3

By | November 28, 2016
Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInDigg thisPin on Pinterest

This web development tutorial is part-3 in series of ASP.NET MVC Shopping Cart Application. In this three parts series, we tried to learn how to develop an Online Shopping Store Application using ASP.NET MVC, C#, Entity Framework and MS SQL Server?

So far we have covered the major features of an ASP.NET MVC Shopping Cart including ASP.NET MVC Project Setup, Administration of Categories and Products, Featuring Products, Product Display Center for end user, Product Search and Product details, End User Registration and Shopping Cart Management etc.

If you have directly landed to this Part of ASP.NET MVC Online Store Application, I’ll recommend to go through the previous parts of this Web Development Tutorial Series to understand the previously implemented features.

Complete Source Code for the ASP.NET MVC Shopping Cart application is now available to download here. You just need to be a REGISTERED Member to download Source Code. Registration is FREE :)

Now, we are going to complete it by covering the following features in this part:

  • Checkout Option
  • Shipping Details
  • Payment Option (A dummy Page)
  • Order Placement
  • Order Summary on Successful Payment
  • Administration – View/List Orders
  • Administration – Single Order Detailed View

ASP.NET MVC Shopping Cart’s My Cart Details:

Let’s start with Shopping Cart Detail Page where user will find a “Proceed to Checkout” button as Checkout Option. Following screen is normally displayed when user add items to it’s Shopping Cart.

Shopping Cart Details

Now, Lets discuss about the implementation, for displaying cart details, there will be an action “MyCart” in “ShoppingController”. The action will contain following code:

The data is fetched from database using stored procedure. The procedure is:

View will contain following code:

So, MyCart action in ShoppingController basically communicates with database through a stored procedure and fetches all the products for a specific user. Further passes the result to respective view which renders the result generate “My Cart Details” as given in above screenshot. User has the option to continue his/her shopping by clicking “Browse Category” or “Search Product” feature or remove an individual item from the Shopping Cart by clicking “Remove from Cart” button against each product listing in My Cart Details.

Checkout Procedure for ASP.NET MVC Online Store:

To see the payment options and adding shipping details, click on “Proceed to Checkout” button on “My Cart Detail” page, following screen will appear. For the sake of clarity and simplicity, following screen displays the products in Online Store with Total Amount to Pay in read-only mode. Further screen displays the Payment Type selection option along with Shipping Address details.
User will choose the appropriate payment type and enter all required fields for Shipping Address and  click on “Proceed to Pay”.

Payment Options

To display the above screen, an action “CheckOut” will be there in “ShoppingController”.
“Checkout” action will contain following code:

Stored procedure “USP_MemberShoppingCartDetails” will calculate the data displayed on the page.

The view will contain following code:

Following model will validate the address:

User will fill the shipping address and select payment type. After that, he/she will click on “Proceed to Pay”. System will apply proper validations in case of any missing required field and display the appropriate message.

Once user click on “Proceed to Pay” after providing valid details, payment will be done and a screen with success message will appear as follows:Order Complete

An order will be placed successfully and record will be updated in database. Here for the sake of simplicity, we are not integrating with any payment gateway right now. There are many other features that can be added to enhance this article series but for now we want to help fellow developers understand and get primary knowledge of developing an online shopping cart application in ASP.NET MVC.

For payment completion, there will be an action “PaymentSuccess” in “ShoppingController”,

The view will contain following code:

There will be a table “Tbl_ShippingDetails” to capture shipping details.MVC Shopping Cart Shipping Details

So far we covered the end user part of choosing a product, adding to shopping cart and finally placing an order. Now onward, we will covering the admin part for the order being placed.Exam: 70-486

Online Shopping Cart – Orders Management

Once the user’s online transaction is completed in an online store, another important area to cover is the “Order Management”. Administrator should be able to view all orders that are placed online and further proceed operationally to fulfill those orders.

To facilitate administrator for these operational activities, Orders list view and detailed view are really important and that’s what we are going cover here.

Order List View:

This page will display all orders corresponding to a product. Screen will look as:

Order Management

On click of view detail or the order count, admin can see the order details further. Lets go through the code for Oder List View first:

  • Learn ASP NET MVC 5 step by step [Maruti Makwana, Corporate Trainer] 28 Lectures, 2.5 Hours Video, Intermediate Level
    Very easy to learn video series on Asp.Net MVC 5 Specially for those who are familiar with Asp.Net Web forms.
  • AngularJS for ASP.NET MVC Developers [Brett Romero] 10 Lectures, 1 hour video, Intermediate Level
    The Fastest Way For .NET Developers To Add AngularJS To Their Resume
  • ASP.NET with Entity Framework from Scratch
    [Manzoor Ahmad, MCPD | MCT] 77 Lectures, 10 hour video, All Level
    Latest approach of web application development
  • Comprehensive ASP.NET MVC [3D BUZZ] 34 lectures, 14 Hours Video, All Levels
    From zero knowledge of ASP.NET to deploying a complete project to production.

Single Order Detail View:

This page will display the customer details of the product. The page will look as :

Online Store Order Details

Code for Detailed Page is here:

This was all about a basic ASP.NET MVC Online Shopping Store Application using C#, Entity Framework (EF) and SQL Server. We have tried to provide and explain the maximum details with code snippet for better understanding with a developer point of view. But if you still have a question in mind or want some specific feature to be added, feel free to post here. We will try our best to answer and enhance this  Online Store App further.

Part 2 – Building ASP.NET MVC Shopping Cart Application

Complete Source Code for the ASP.NET MVC Shopping Cart application is now available to download here. You just need to be a REGISTERED Member to download Source Code. Registration is FREE :)

:::To test your ASP.NET MVC Skills, take a free Online Test:::

Enjoy ASP.NET MVC Programming!

Advanced Web Developer Interview Questions and Answers Series:

Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInDigg thisPin on Pinterest
  • Wasif Bhatti

    Code has been complted please share source code of shopping cart with me. i will be very greatful of you

    • Dear Wasif,

      Thanks for being patient. We really value an engaged member like you.

      Now you can download the complete source code for ASP.NET MVC Shopping Cart Application. We are planning to provide more practical applications with source code on web related technologies in future and the very next is “A Basic Expense Management Application” using AngularJS with ASP.NET Web API.

      So, Keep learning & sharing with others.


      • Wasif Bhatti

        I’m really happy to have people like you. you guys are very supportive. you always reply when we need help r if there are any understanding issues.
        I need the URL from where i can download the source code.
        God Bless You

  • Wasif Bhatti

    Dear dear Mr/Ms. Admin. kindly share the code. im facing difficulty to complte this project. there are some areas where i hv been stuck…

  • Manav Pandya

    please share full source code :

    • Hi Manav,

      Complete source code for the above ASP.NET MVC Shopping Cart Application is now available to download.


      • Manav Pandya

        Where is the link to download ??
        I could not able to find …
        Reply me

  • Carlos

    Hi, please tell me where is it the _LoginPartial code, view or page into de source code?thanks

  • evee

    Hi, pls help me…
    I have this error : An exception of type ‘System.Data.Entity.Core.EntityException’ occurred in EntityFramework.SqlServer.dll but was not handled in user code

    Additional information: The underlying provider failed on Open.

    at this line:
    filterContext.Controller.ViewBag.CategoryAndSubCategory = _unitOfWork.GetRepositoryInstance().GetAllRecordsIQueryable().ToList();

    and i don’t know what it is wrong…