Integrate other component inside the card in ASP.NET CORE Card

17 Aug 20261 minute to read

You can integrate any component inside the card element. Here, ListView component is placed inside the card for showcasing the To-Do list.

@using Syncfusion.EJ2;
@using Syncfusion.EJ2.Lists;
@{
    List<object> listdata = new List<object>();
    listdata.Add(new { todoList = "Pay Bills" });
    listdata.Add(new { todoList = "Call Chris" });
    listdata.Add(new { todoList = "Meet Andrew" });
    listdata.Add(new { todoList = "Visit Manager" });
    listdata.Add(new { todoList = "Customer Meeting" });
}

<div tabindex="0" class="e-card" id="basic">
    <div class="e-card-title">To-Do List</div>
    <div class="e-card-separator"></div>
    <div class="e-card-content">
        <ejs-listview id="listview" dataSource="listdata" showCheckBox="true">
            <e-listview-fieldsettings Text="todoList"></e-listview-fieldsettings>
        </ejs-listview>
    </div>
</div>

Alt text

NOTE

View Sample in GitHub.