Search results

Integrate other component inside the card in ASP.NET MVC Card control

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

razor
controller.cs
@using Syncfusion.EJ2.Lists;

<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">
        @Html.EJS().ListView("element").DataSource((IEnumerable<object>)ViewBag.dataSource).Fields(new ListViewFieldSettings { Text = "todoList" }).ShowCheckBox(true).Render()
    </div>
</div>
public ActionResult Index()
{
    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" });
    ViewBag.dataSource = listdata;
    return View();
}

Output be like the below.

Alt text