ASP.NET Core 2.2 - Sorting Entities

This article will describe how to sort a list of entities. I will assume you have created a new ASP.NET Core 2.2 Razor Pages project. I won't use Identity or Individual User Accounts.

The FREE ASP.NET Core 6.0 - Demos And Utilities Project includes a Table Functions Demo. I created a topic, ASP.NET Core 6.0 - Demos And Utilities Project for discussions. Access to the source code is free for registered users at Manage > Assets.

I will try to add value to many great articles about sorting by using ascending and descending sorts on multiple columns.

Edit Index.cshtml.cs, add the sorting properties and queries:
private readonly FoodDbContext _context;

public IndexModel(FoodDbContext context)
{
    _context = context;
}

public int Count { get; set; }

public IList<Food> Foods { get; set; } = new List<Food>();

[Display(Name = "Selected Sort")]
public string SelectedSort { get; set; }

public void OnGet(string selectedSort = "NameAsc")
{
    var foodQuery = _context.Foods.AsQueryable();

    SelectedSort = selectedSort;

    switch (SelectedSort)
    {
        case "NameAsc":
            foodQuery = foodQuery.OrderBy(f => f.Name).AsQueryable();
            break;
        case "NameDesc":
            foodQuery = foodQuery.OrderByDescending(f => f.Name).AsQueryable();
            break;
        case "FoodTypeAsc":
            foodQuery = foodQuery.OrderBy(f => f.FoodType).AsQueryable();
            break;
        case "FoodTypeDesc":
            foodQuery = foodQuery.OrderByDescending(f => f.FoodType).AsQueryable();
            break;
        case "ColdStoreAsc":
            foodQuery = foodQuery.OrderBy(f => f.ColdStore).AsQueryable();
            break;
        case "ColdStoreDesc":
            foodQuery = foodQuery.OrderByDescending(f => f.ColdStore).AsQueryable();
            break;
        case "DateAsc":
            foodQuery = foodQuery.OrderBy(f => f.Date).AsQueryable();
            break;
        case "DateDesc":
            foodQuery = foodQuery.OrderByDescending(f => f.Date).AsQueryable();
            break;
        default:
            break;
    }

    Foods = foodQuery.ToList();

    Count = Foods.Count();

}
Edit Index.cshtml, add the sort links:
<thead>
    <tr>
        <th class="d-none d-lg-table-cell pb-2">
            @Html.DisplayNameFor(model => model.Foods[0].Id)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Foods[0].Name)
            <div class="btn-group">
                @{ if (Model.SelectedSort == "NameAsc")
                    {
                        <a class="btn btn-primary btn-sm disabled">
                            ▼
                        </a>
                    }
                    else
                    {
                        <a asp-route-currentPage="1"
                           asp-route-selectedSort="NameAsc"
                           class="btn btn-light btn-sm">
                            ▼
                        </a>
                    }
                }
                @{ if (Model.SelectedSort == "NameDesc")
                    {
                        <a class="btn btn-primary btn-sm disabled">
                            ▲
                        </a>
                    }
                    else
                    {
                        <a asp-route-currentPage="1"
                           asp-route-selectedSort="NameDesc"
                           class="btn btn-light btn-sm">
                            ▲
                        </a>
                    }
                }
            </div>
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Foods[0].FoodType)
            <div class="btn-group">
                @{ if (Model.SelectedSort == "FoodTypeAsc")
                    {
                        <a class="btn btn-primary btn-sm disabled">
                            ▼
                        </a>
                    }
                    else
                    {
                        <a asp-route-currentPage="1"
                           asp-route-selectedSort="FoodTypeAsc"
                           class="btn btn-light btn-sm">
                            ▼
                        </a>
                    }
                }
                @{ if (Model.SelectedSort == "FoodTypeDesc")
                    {
                        <a class="btn btn-primary btn-sm disabled">
                            ▲
                        </a>
                    }
                    else
                    {
                        <a asp-route-currentPage="1"
                           asp-route-selectedSort="FoodTypeDesc"
                           class="btn btn-light btn-sm">
                            ▲
                        </a>
                    }
                }
            </div>
        </th>
        <th class="d-none d-md-table-cell text-center">
            @Html.DisplayNameFor(model => model.Foods[0].ColdStore)
            <div class="btn-group">
                @{ if (Model.SelectedSort == "ColdStoreAsc")
                    {
                        <a class="btn btn-primary btn-sm disabled">
                            ▼
                        </a>
                    }
                    else
                    {
                        <a asp-route-currentPage="1"
                           asp-route-selectedSort="ColdStoreAsc"
                           class="btn btn-light btn-sm">
                            ▼
                        </a>
                    }
                }
                @{ if (Model.SelectedSort == "ColdStoreDesc")
                    {
                        <a class="btn btn-primary btn-sm disabled">
                            ▲
                        </a>
                    }
                    else
                    {
                        <a asp-route-currentPage="1"
                           asp-route-selectedSort="ColdStoreDesc"
                           class="btn btn-light btn-sm">
                            ▲
                        </a>
                    }
                }
            </div>
        </th>
        <th class="d-none d-lg-table-cell">
            @Html.DisplayNameFor(model => model.Foods[0].Date)
            <div class="btn-group">
                @{ if (Model.SelectedSort == "DateAsc")
                    {
                        <a class="btn btn-primary btn-sm disabled">
                            ▼
                        </a>
                    }
                    else
                    {
                        <a asp-route-currentPage="1"
                           asp-route-selectedSort="DateAsc"
                           class="btn btn-light btn-sm">
                            ▼
                        </a>
                    }
                }
                @{ if (Model.SelectedSort == "DateDesc")
                    {
                        <a class="btn btn-primary btn-sm disabled">
                            ▲
                        </a>
                    }
                    else
                    {
                        <a asp-route-currentPage="1"
                           asp-route-selectedSort="DateDesc"
                           class="btn btn-light btn-sm">
                            ▲
                        </a>
                    }
                }
            </div>
        </th>
        <th class="pb-2">
            Actions
        </th>
    </tr>
</thead>

Build, run and test.

Sorted Table
Update 12/30/2021

Announced the ASP.NET Core 6.0 - Demos And Utilities Project. Updated articles, asset and topic links.

Ken Haggerty
Created 08/25/19
Updated 12/30/21 16:55 GMT

Log In or Reset Quota to read more.

Article Tags:

EF Core Model
Successfully completed. Thank you for contributing.
Contribute to enjoy content without advertisments.
Something went wrong. Please try again.

Comments(0)

Loading...
Loading...

Not accepting new comments.

Submit your comment. Comments are moderated.

User Image
DisplayedName - Member Since ?