AjaxRadioList

Cascading Radio button list using binding to Parent



AjaxRadioList needs an url, js func or controller to get data from, it will render a list of radiobuttons
As with most awesome controls, you can bind the AjaxRadioList to one or more parents, and when the parent changes value the child will load and get the parent values as parameters in its data function
AjaxRadioListDemo/Index.cshtml
@(Html.Awe().AjaxRadioListFor(o => o.ParentCategory)
.Url(Url.Action("GetCategories", "Data")))
@(Html.Awe().AjaxRadioListFor(o => o.ChildMeal)
.Url(Url.Action("GetMeals", "Data"))
.Parent(o => o.ParentCategory, "categories"))
Awesome/DataController.cs
public IActionResult GetCategories()
{
return Json(Db.Categories.Select(o => new KeyContent(o.Id, o.Name)));
}

public IActionResult 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);
}

Client data

Besides remote data using .Url(str), it can also get data from the client using .DataFunc(jsFunc), the jsFunc can return the items or a Promise
AjaxRadioListDemo/Index.cshtml
<script>
function getClientData() {
return [{ k: 1, c: 'Fruits' }, { k: 2, c: 'Vegetables' }, { k: 3, c: 'Nuts' }];
}
</script>
@(Html.Awe().AjaxRadioList("CatClient1")
.DataFunc("getClientData")
.Value(2))

Using predefined parameters

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



Comments