Master the Syncfusion ListView component for ASP.NET Core to create interactive, data-bound lists with advanced features like grouping, virtualization, templates, and nested navigation.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
A direct command skips the review prompt. Inspect the source before running it.
The command stays on one line. Scroll horizontally to inspect it before copying.
Prefer a local copy? Download the files currently available to SkillsMP.
File Explorer
12 files
Showing SKILL.md
SKILL.md
Source instructions · Read-only preview
More from this repository
name
syncfusion-aspnetcore-listview
description
Master the Syncfusion ListView component for ASP.NET Core to create interactive, data-bound lists with advanced features like grouping, virtualization, templates, and nested navigation.
metadata
{"author":"Syncfusion Inc","version":"34.1.29"}
Implementing ListView in ASP.NET Core
The ListView component is a powerful, feature-rich control that displays data in interactive hierarchical structures. It supports data binding (local and remote), grouping, nested lists, custom templates, virtualization for performance, and comprehensive keyboard accessibility.
When to Use This Skill
Use this skill when you need to:
Display Interactive Lists: Render data collections with click selection, hover effects, and visual feedback
Group Related Items: Organize list items into categories using the groupBy field
Support Nested Navigation: Create multi-level hierarchies with parent-child relationships
Optimize Performance: Handle large datasets (1000+ items) with UI virtualization
Customize Appearance: Apply templates for headers, items, and group titles
Enable Selection: Implement single or multi-select with checkboxes
Handle Remote Data: Bind to server APIs with DataManager and Query
Implement Keyboard Access: Support keyboard navigation for accessibility
Component Overview
The ListView component in Syncfusion EJ2 for ASP.NET Core uses TagHelper syntax and exposes core properties:
@{
ViewData["Title"] = "ListView Example";
List<ListItem> dataSource = new List<ListItem>()
{
new ListItem { id = "1", text = "Artwork" },
new ListItem { id = "2", text = "Abstract" },
new ListItem { id = "3", text = "Modern Painting" },
new ListItem { id = "4", text = "Ceramics" }
};
}
<ejs-listview id="list" dataSource="dataSource"
showHeader="true" headerTitle="Art Gallery">
</ejs-listview>
@code {
public class ListItem
{
public string id { get; set; }
public string text { get; set; }
}
}