ASP.net Core Awesome Controls overview

 
 
 
  •  

Grid bound to parent controls for filtering

Grid bound using the parent extension to two textboxes (txtPerson, txtFood) and a dropdown list (selCountry) for filtering.
Fetches data for the current page from the controller.
Has reordering, resizing, and session-based persistence, and auto-hiding based on available width for two columns (Date and Location).
Home/Index.cshtml
<h2>Grid bound to parent controls for filtering</h2>
<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(330)
.Reorderable()
.Resizable()
.Persistence(Persistence.Session)
.Parent("txtPerson", "person")
.Parent("txtFood", "food")
.Parent("selCountry", "country"))
Awesome/Grid/LunchGridController.cs
public IActionResult GetItems(GridParams g, int? country, string person, string food)
{
var query = Db.Lunches.AsQueryable();

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);

var gmb = new GridModelBuilder<Lunch>(query.AsQueryable(), g);

gmb.KeyProp = o => o.Id;

// grid row model
// columns bound to Food.Name by default will display rowModel.FoodName
// or specify in the view Column.Prop ="FooName", or ClientFormat = ".(FoodName)"
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());
}


See also:
Side Menu
Deferred Load
TreeGrid, Popup CRUD
TreeGrid Inline Editing
Master Detail Crud Demo
Wizard Demo



Comments