ListBox
Grouping
Features
Sample
ListBox Grouping
Use the showGroups property to add group headers to ListBox controls.
Group header items are added if the showGroups property is set to true and the itemsSource collection has grouping enabled.
Header items are presentational only. They cannot be selected with the mouse or keyboard and are not bound to any data items.
Description
This sample shows how to show group items of the ListBox control.
Source
GroupingController.cs
using System; using System.Collections.Generic; using System.Linq; using System.Threading.Tasks; using Microsoft.AspNetCore.Mvc; using MvcExplorer.Models; namespace MvcExplorer.Controllers { public partial class ListBoxController : Controller { // GET: /<controller>/ public ActionResult Grouping() { return View(_db.Orders.Take(20).ToList()); } } }
Grouping.cshtml
@model List<Order> <div> <h2> @Html.Raw(ListBoxRes.Grouping_Text0) </h2> <p> @Html.Raw(ListBoxRes.Grouping_Text1) </p> <p> @Html.Raw(ListBoxRes.Grouping_Text2) </p> <p> @Html.Raw(ListBoxRes.Grouping_Text3) </p> </div> <div> <c1-list-box display-member-path="ShipName" style="height:200px; width:250px" show-groups="true"> <c1-items-source source-collection="@Model" group-by="ShipCountry"></c1-items-source> </c1-list-box> </div> @section Description{ @Html.Raw(ListBoxRes.Grouping_Text4) }
Documentation