FlexGrid
Boolean Checker
Use the BooleanChecker extender to add checkboxes to groups and column header of boolean column for checking all values in groups or column.
Features
Sample
Settings
Description
In this sample, the BooleanChecker is attached to "Active" column for checking all active values.
To show checkboxes in groups header, need setting Aggregate property of the "Active" column as Aggregate.First.
Note that the BooleanChecker only works with the boolean column. Therefore, with remote data binding, you should manually set the DataType of the column as DataType.Boolean.
Use the BigCheckboxes property to sets a value that determines whether the checkboxes used to edit boolean columns should extend to cover the whole cell width.
Source
BooleanCheckerController.cs
using C1.Web.Mvc;
using System.Collections.Generic;
using System.Linq;
using C1.Web.Mvc.Serialization;
using Microsoft.AspNetCore.Mvc;
using MvcExplorer.Models;
using System;
namespace MvcExplorer.Controllers
{
public partial class FlexGridController : Controller
{
private static List<Sale> _source = Sale.GetData(20).ToList<Sale>();
public ActionResult BooleanChecker()
{
ViewBag.DemoSettingsModel = new ClientSettingsModel
{
Settings = new Dictionary<string, object[]>
{
{"ShowCheckAll", new object[]{"True", "False"}},
{"ShowCheckGroups", new object[]{"True", "False"}}
}
};
return View();
}
public ActionResult GridBooleanCheckerBind([C1JsonRequest] CollectionViewRequest<Sale> requestData)
{
return this.C1Json(CollectionViewHelper.Read(requestData, _source));
}
public ActionResult GridBooleanCheckerUpdate([C1JsonRequest]CollectionViewEditRequest<Sale> requestData)
{
return this.C1Json(CollectionViewHelper.Edit(requestData, sale =>
{
string error = string.Empty;
bool success = true;
var fSale = _source.Find(item => item.ID == sale.ID);
fSale.Country = sale.Country;
fSale.Amount = sale.Amount;
fSale.Start = sale.Start;
fSale.End = sale.End;
fSale.Product = sale.Product;
fSale.Active = sale.Active;
fSale.Amount2 = sale.Amount2;
fSale.Color = sale.Color;
return new CollectionViewItemResult<Sale>
{
Error = error,
Success = success && ModelState.IsValid,
Data = fSale
};
}, () => _source));
}
}
}
BooleanChecker.cshtml
@model IEnumerable<Sale>
@{
ViewBag.DemoSettings = true;
var controlId = (ViewBag.DemoSettingsModel as ClientSettingsModel).ControlId;
}
@section Scripts{
<script type="text/javascript">
function customChangeShowCheckAll(grid, value) {
let selector = c1.getExtenders(grid, wijmo.grid.selector.Selector)[0];
selector.showCheckAll = (value == 'False' ? false : true);
grid.endUpdate();
}
function customChangeShowCheckGroups(grid, value) {
grid.getColumn('Active').aggregate = (value == 'True' ? 'First' : 'None');
grid.endUpdate();
}
</script>
}
<c1-flex-grid id="@controlId" allow-add-new="true" allow-delete="true"
auto-generate-columns="false" style="height:500px" group-by="Country" show-groups="true"
big-checkboxes="true">
<c1-flex-grid-column binding="ID" width="0.4*" is-read-only="true"></c1-flex-grid-column>
<c1-flex-grid-column binding="Start" header="Date" width="*" format="d"></c1-flex-grid-column>
<c1-flex-grid-column binding="End" header="Time" width="*" format="t"></c1-flex-grid-column>
<c1-flex-grid-column binding="Country" width="1.5*"></c1-flex-grid-column>
<c1-flex-grid-column binding="Product" width="1.5*"></c1-flex-grid-column>
<c1-flex-grid-column binding="Amount" width="1.5*" format="n2"></c1-flex-grid-column>
<c1-flex-grid-column binding="Amount2" width="1.5*" format="n2"></c1-flex-grid-column>
<c1-flex-grid-column binding="Color" width="1.5*" format="n2"></c1-flex-grid-column>
<c1-flex-grid-column binding="Active" width="1.5*" format="n2" aggregate="First" c1-data-type="C1.Web.Mvc.Grid.DataType.Boolean"></c1-flex-grid-column>
<c1-items-source read-action-url="@Url.Action("GridBooleanCheckerBind")"
update-action-url="@Url.Action("GridBooleanCheckerUpdate")">
</c1-items-source>
<c1-flex-grid-boolean-checker column="Active" show-check-all="true"></c1-flex-grid-boolean-checker>
</c1-flex-grid>
@section Summary{
@Html.Raw(FlexGridRes.BooleanChecker_Text0)
}
@section Description{
<p>@Html.Raw(FlexGridRes.BooleanChecker_Text1)</p>
<p>@Html.Raw(FlexGridRes.BigCheckboxes_Text0)</p>
}
Documentation