AjaxList Custom Item Template

To use custom item template in the controller instead of setting the Items property you have to set the Content property with the prerendered html content.
RenderView is a controller extension from Omu.AwesomeMvc that renders a view and returns the result as a string.
The view that gets rendered must consist from 'li' tags (or 'tr' if using TableLayout) with class="awe-li" and data-val=key attributes

AjaxListDemo/CustomItemTemplate.cshtml

@Html.Awe().AjaxList("MealsCustomItem")

Awesome/AjaxList/MealsCustomItemAjaxListController.cs

using System.Linq;
using Microsoft.AspNetCore.Mvc;

using AweCoreDemo.Models;

using Omu.AwesomeMvc;
using System.Threading.Tasks;
using AweCoreDemo.Data;
using AweCoreDemo.Utils.Awesome;

namespace AweCoreDemo.Controllers.Awesome.AjaxList
{
    public class MealsCustomItemAjaxListController : Controller
    {
        private readonly MyContext mcx = new MyContext();// mock EF Db context

        public MealsCustomItemAjaxListController()
        {
            
        }

        public async Task<IActionResult> Search(int page)
        {            
            var query = mcx.Meals.Include(o => o.Category);
            
            var res = await EFAweUtil.BuildListAsync(query, page, 5, 
                setContentFunc: items => this.RenderPartialView("CustomItem", items));

            return Json(res);            
        }
    }
}

MealsCustomItemAjaxList/CustomItem.cshtml

@using AweCoreDemo.Models
@{
    Layout = null;
}
@model IList<Meal>

@foreach (Meal meal in Model)
{
    <li class="awe-li" data-val="@meal.Id">
        Name: @meal.Name
        <br />
        Category: @meal.Category.Name
        <br />
        Description: @meal.Description
    </li>
}

Comments