This is the 3rd instalment of my attempts to modify and complete the original walkthrough of Orchard using the latest change set of the Orchard Framework. Check out part 1 and part 2 here.

Working with Data

Let’s now look at how to work with data. The objective for this section is to create a ProductRecord type that is persisted to the database. We’ll then update the Commerce area admin pages to be able to list and create new products.

Objectives:

1. Create a ProductRecord type that is persisted to the database

2. Add admin pages for creating and listing products

Follow These Steps:

1. Create “ProductRecord.cs” in “Models” folder

using System.ComponentModel.DataAnnotations;
using System.Web.Mvc; 

namespace Orchard.Commerce.Models
{
     public class ProductRecord
    {
         public virtual int Id { get; set; }

         [Required]
        public virtual string Sku { get; set; }

         [Required]
        public virtual string Description { get; set; }

         [Required]
        public virtual decimal Price { get; set; }
     }
 }

 

Orchard generally favors convention over configuration, and in the example above, there are a few conventions at work. First, the *Record suffix on the class, coupled with the fact that the class lives under the *.Models namespace, tells Orchard this is a persistent class that should be backed by a database table. Second, the property named “Id” is conventionally used as the primary key for the record.

2. Add the “IRepository<ProductRecord>” to the AdminController. This is another example of using dependency injection to receive access to services (in this case, the database).

using Orchard.Data;

using Orchard.Commerce.Models;

    [Admin]
    [Themed]
    public class AdminController : Controller
    {
        private readonly IRepository<ProductRecord> _repository;

         public AdminController(IRepository<ProductRecord> repository)
        {
            _repository = repository;
        }

         //
        // GET: /Admin/
         public ActionResult Index()
        {
            return View();
        }
     }

3. Create the 2 “Admin/Create” actions (typical MVC pattern for entity creation)

public ActionResult Create()
        {
            return View(new ProductRecord());
        }

         [HttpPost]
        public ActionResult Create(ProductRecord product)
        {
            if (!ModelState.IsValid)
            {
                return View(product);
            }

            _repository.Create(product);
            return RedirectToAction("Index");
        }

Now, we are going to add the corresponding “Create” view…

4. Build the project first, so the ProductRecord type is available in the Add View dialog.

5. Right-click the Create action and choose “Add View…”

6. Select the “Create a partial view (.ascx)” option

7. Select the “Create a strongly-typed view” option and type “Orchard.Web.Areas.Commerce.Models.ProductRecord” for the View data class. Select “Create” as the View content.

8. In the view markup/code, change the ID field to be hidden:

<div class="editor-label">
        <%= Html.HiddenFor(model => model.Id) %>
    </div>
    <div class="editor-field">
        <%= Html.HiddenFor(model => model.Id) %>
        <%= Html.ValidationMessageFor(model => model.Id) %>
    </div>

9. Change Html.BeginForm to Html.BeginFormAntiForgeryPost

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<Orchard.Commerce.Models.ProductRecord>" %>
<% using (Html.BeginFormAntiForgeryPost())   {%>
<%: Html.ValidationSummary(true) %>

10. In AdminController.cs, update the Index() method to pass the list of Products from the repository:

public ActionResult Index()
{
     return View(_repository.Table);
}

11. Delete “Views\Admin\index.ascx” file (we are going to re-create it as a “List” view).

12. In AdminController.cs, right-click the “Index()” action and chose “Add View…” to recreate the “Index” view.

a. Choose the partial view option

b. Select the strongly-typed view option, typing “Orchard.Web.Areas.Commerce.Models.ProductRecord” for the View data class.

c. Select “List” as the View content.

13. Open Index.ascx

d. Update the table class: <table class="items"> (so it looks nice)

14. Type Ctrl-F5 to build and run the site in Visual Studio.

15. Go to the “Manage Products” admin page

NOTE: So far we have been following the steps in the original document, which should be OK. However with Devtools module added in recent change set, the database table for Product records does not get built automatically. In fact you will get an error message if you click on Manage Products.

16. Login to admin module. Click on Site Configuration –> Features and enable Orchard.DevTools module

17. After the refresh you shall see Developer Tools under the Site Configuration menu, click on it. Then in the Dev Tools page, click on Database Migration

18. Then you are presented with only 1 menu item which is Update Database option. Click on it to start the table creation.

19. Once you see the “Database Updated successfully” option, go back to the Admin page.

Then click on Manage Products under the Commerce menu. And Boo Yah! You will see the manage products page rendered nicely.

20. You can create a product (with validation)

21. The “Index” view shows the list of product from the db:

22. Enter a few products to use as sample data…