Grid control basic features

The Awesome Grid control for ASP.net Core and MVC is used to display data, by default using a table, but that can be changed. Documentation

It can get the data from the server by specifying the url Url(urlstr) or from a js function DataFunc(jsfunc) (the javascript function could also do an ajax request and return the promise).
The Grid (like most awesome controls) can be bound to other controls using the Parent extension (used for filtering). It can also be filtered using the api.
Mods are used to add additional features to the grid like: inline editing, automatic columns hiding and via dropdown, adaptive pager (based on window width), and more.

Features:

Sorting (multiple and single column), Grouping
Resize, reorder, hide and show columns (using columns selector mod or api)
Persistence - save columns state, current page and collapsed groups/nodes
Filtering
Custom formatting
Client side api
Tree Grid
Nesting
Hierarchical grid (done using nesting)
Inline Editing (using mod)
Multiple rows group headers
Reorder rows, also from one grid to another
Frozen Columns, on the left and right side of the grid
Selection
RTL Support
Responsive layout, and autohide columns (using Autohide mod)
Custom rendering
Infinite scrolling
Cards View (using custom rendering mod)
Client data source - get data from a js function instead of specifying url
Export to excel, pdf, txt (csv) - demo

Other grid crud demos: Grid Crud (Popup), Grid in nest editing, Master Detail Crud Demo

GridDemo/Index.cshtml

<div class="bar">
    @Html.Awe().TextBox(new TextBoxOpt{ Name = "txtPerson", Placeholder = "search for person ...", CssClass = "searchtxt", ClearBtn = true })
    @Html.Awe().TextBox(new TextBoxOpt{ Name = "txtFood", Placeholder = "search for food ...", CssClass = "searchtxt", ClearBtn = true })        
    @(Html.Awe().DropdownList(
        new DropdownListOpt
    {
        Name = "selCountry",
        Url = Url.Action("GetCountries", "Data"),
        ClearBtn = true
    }))
</div>

@(Html.Awe().Grid("Grid1")
    .Mod(o => o.Main())
    .Columns(
    new Column { Bind = "Id", Width = 75, Groupable = false, Resizable = false },
    new Column { Bind = "Person" },
    new Column { Bind = "Food.Name", ClientFormatFunc = "site.imgFood", MinWidth = 200 },
    new Column { Bind = "Country.Name", Header = "Country" },
    new Column { Bind = "Date", Grow = .1 }.Mod(o => o.Autohide()),
    new Column { Bind = "Location" }.Mod(o => o.Autohide()),
    new Column { Bind = "Chef.FirstName,Chef.LastName", Prop = "ChefName", Header = "Chef" })
    .Url(Url.Action("GetItems", "LunchGrid"))
    .Height(350)
    .Reorderable()
    .Resizable()
    .Persistence(Persistence.Session)
    .Parent("txtPerson", "person")
    .Parent("txtFood", "food")
    .Parent("selCountry", "country"))

Awesome/Grid/LunchGridController.cs

public class LunchGridController : Controller
{
    private readonly MyContext mcx = new MyContext();// mock EF Db context

    public LunchGridController()
    {
        
    }

    public IActionResult GetItems(GridParams g, int? country, string person, string food)
    {
        // get Lunch[] sample data (see other demos for EF demo)
        var query = getLunchesArray().AsQueryable();            

        // filtering
        if (person != null) query = query.Where(o => o.Person.ToLower().Contains(person.ToLower()));
        if (food != null) query = query.Where(o => o.Food.Name.ToLower().Contains(food.ToLower()));
        if (country.HasValue) query = query.Where(o => o.Country.Id == country);

        // data can be from any source as long here you pass an IQueryable<T>
        var gmb = new GridModelBuilder<Lunch>(query.AsQueryable(), g);
        
        // define grid key, used to identify rows
        gmb.KeyProp = o => o.Id;
         
        // grid row model
        // columns bound to Prop1.Prop2 will automatically display Prop1Prop2,
        // or you could specify in the view Column.Prop ="Prop1Prop2", or ClientFormat = ".(Prop1Prop2)"
        gmb.Map = o => new
        {
            o.Id,
            o.Person,
            FoodName = o.Food.Name,
            FoodPic = o.Food.Pic,
            o.Location,
            o.Price,
            Date = o.Date.ToShortDateString(),
            CountryName = o.Country.Name,
            ChefName = o.Chef.FullName
        };

        return Json(gmb.Build());            
    }

    private Lunch[] getLunchesArray()
    {
        return mcx.Lunches
            .Include(o => o.Country)
            .Include(o => o.Food)
            .Include(o => o.Chef)
            .ToArray();                
    }

    public async Task<IActionResult> GetItemsEFExample(GridParams g, int? country, string person, string food)
    {
        var query = mcx.Lunches
            .Include(o => o.Country)
            .Include(o => o.Food)
            .Include(o => o.Chef)
            .AsQueryable();

        // Filter - custom extension in demo code
        // equivalent to .Where(o => o.Food.Name.Contains(food) || ...)

        query = query
            .Filter(food, o => o.Food.Name)
            .Filter(person, o => o.Person);

        if (country.HasValue) query = query.Where(o => o.Country.Id == country);

        var gmb = new GridModelBuilder<Lunch>(query, g);
        gmb.KeyProp = o => o.Id;
        gmb.Map = o => new
        {
            o.Id,
            o.Person,
            FoodName = o.Food.Name,
            FoodPic = o.Food.Pic,
            o.Location,
            o.Price,
            Date = o.Date.ToShortDateString(),
            CountryName = o.Country.Name,
            ChefName = o.Chef.FullName
        };

        return Json(await gmb.EFBuildAsync());
        // you can use .Build() for non EF datasource (like a List<Lunch> query)
        // EFBuildAsync - custom extension for EF, you can copy it from demo source code
    }
}