# | Name | Surname | Marital status | Age | Birthday | Employed | |
---|---|---|---|---|---|---|---|
1 | Joe | Crosswave | Married | 32 | 1/5/1992 | Unemployed | |
2 | Merry | Lisel | Widowed | 42 | 5/6/1982 | Unemployed | |
3 | Henry | Crux | Single | 30 | 11/19/1994 | Employed | |
4 | Cody | Jurut | 50 | 8/11/1974 | Unemployed | ||
5 | Simon | Scranton | Single | 35 | 10/10/1989 | Unemployed | |
6 | Leena | Laurent | Divorced | 20 | 7/1/2004 | Unemployed | |
7 | Ode | Cosmides | Married | 54 | 4/17/1970 | Employed | |
8 | Diandra | Mizner | Single | 21 | 8/20/2003 | Unemployed | |
9 | Pete | Cassel | Married | 23 | 3/13/2001 | Unemployed | |
10 | Nicky | Tremblay | Married | 32 | 1/5/1992 | Employed | |
11 | Mary | Cassel | Married | 25 | 7/10/1999 | Employed |
@model IQueryable<Person>
@(Html
.Grid(Model)
.Build(columns =>
{
columns.Add(model => Html.CheckBox("Check_" + model.Id)).Titled(Html.CheckBox("CheckAll"));
columns.Add().RenderedAs((model, row) => row + 1).Titled("#").Css("text-center");
columns.Add(model => model.Name).Titled("Name");
columns.Add(model => model.Surname).Titled("Surname");
columns.Add(model => model.MaritalStatus).Titled("Marital status");
columns.Add(model => model.Age).Titled("Age");
columns.Add(model => model.Birthday).Titled("Birthday").Formatted("{0:d}");
columns.Add(model => model.IsWorking).Titled("Employed").RenderedAs(model => model.IsWorking == true ? "Employed" : "Unemployed");
})
)
<script>
document.getElementById("CheckAll").addEventListener("change", function () {
document.querySelectorAll("[id^='Check_'").forEach(checkbox => checkbox.checked = this.checked);
});
</script>