AjaxCheckboxList

It renders a list of checkboxes, needs an url, js func or controller to get data from.

Cascading CheckboxList using binding to parent

AjaxCheckboxListDemo/Index.cshtml
<h3>Cascading CheckboxList using binding to parent</h3>
@(Html.Awe().AjaxCheckboxListFor(o => o.ParentCategory)
.Url(Url.Action("GetCategories", "Data")))

@(Html.Awe().AjaxCheckboxListFor(o => o.ChildMeals)
.Parent(o => o.ParentCategory, "categories")
.Url(Url.Action("GetMeals", "Data")))
Awesome/DataController.cs
public ActionResult GetCategories()
{
return Json(Db.Categories.Select(o => new KeyContent(o.Id, o.Name)));
}

public ActionResult GetMeals(int[] categories)
{
categories = categories ?? new int[] { };

var items = Db.Meals.Where(o => categories.Contains(o.Category.Id))
.Select(o => new KeyContent(o.Id, o.Name));

return Json(items);
}

Bound to many parents

  •  

Mods



Multiselect, with custom css

AjaxCheckboxListDemo/Index.cshtml
@(Html.Awe().AjaxCheckboxList("CategoriesButtonGroup")
.ButtonGroup()
.Url(Url.Action("GetCategories", "Data")))

<div class="epanel3">
@(Html.Awe().AjaxCheckboxList("CategoriesMulti")
.Multiselect() // custom extension that sets .Mod
.Url(Url.Action("GetCategories", "Data")))

@(Html.Awe().AjaxCheckboxList("AllMealsMulti")
.Multiselect(o => o.NoSelectClose())
.Parent("CategoriesMulti", "categories")
.Url(Url.Action("GetMeals", "Data")))
</div>

@(Html.Awe().AjaxCheckboxList("CategoriesMulti2")
.Mod("awem.multiselb")
.Tag(new { NoSelClose = 1, InLabel = "categories" })
.Url(Url.Action("GetCategories", "Data")))
@*(awem.multiselb) used in grid columns selector mod*@
<br />
<br />

<h3>Multiselect, with custom css</h3>
@(Html.Awe().AjaxCheckboxList("MealsAll")
.Multiselect(o => o.NoSelectClose())
.CssClass("llist")
.Value(Db.Meals.Take(5).Select(o => o.Id))
.Url(Url.Action("GetAllMeals", "Data")))
<style>
.llist {
width: 250px;
}

.llist .multiItem {
width: 100%;
}
</style>

Set value from get items call



setting selected items in the controller by returning AweItems instead of KeyContent[]
AjaxCheckboxListDemo/Index.cshtml
@(Html.Awe().AjaxRadioList("CategorySv")
.Odropdown(o => o.AutoSelectFirst())
.Url(Url.Action("GetCategories", "Data")))

@(Html.Awe().AjaxCheckboxList("MealsSv")
.Parent("CategorySv", "categories")
.Url(Url.Action("GetMealsSetValue", "Data")))
Awesome/DataController.cs
public ActionResult GetMealsSetValue(int[] categories)
{
categories = categories ?? new int[] { };

var items = Db.Meals.Where(o => categories.Contains(o.Category.Id)).ToList();

object value = null;
if (items.Any())
{
value = new[] { items.Skip(1).First().Id };
}

return Json(new AweItems
{
Items = items.Select(o => new KeyContent(o.Id, o.Name)),
Value = value
});
}

Using predefined parameters

setting parameter parent = { Fruits, Legumes } using .Parameter and .ParameterFunc extensions

Events and Api