[CLOSED] CheckboxSelectionModel - checkbox deselect not fired on group deselect
Continuing work on my grid, I've hit an issue with CheckboxSelectionModel checkbox selection/deselection functions. Using the following code as an example, if I use the group select, I will get 'n' alerts from the fnCheckboxSelect function. If I use the group deselect, the fnCheckboxDeselect is not called. Both functions are correctly called if I individually select/deselect a checkbox and also if I use the CheckboxSelectionModel "master" select/deselect checkbox. I've used your MVC example code to reproduce. I suspect that it may be an ExtJS issue though!
Controller action code :-
Code:
public StoreResult GetData()
{
var data = new List<object>();
for (int i = 0; i < 10; i++)
{
data.Add( new { group = "Group 1", test = "Test " + i.ToString(), selected = (i % 2 == 0) ? true : false });
}
for (int i = 0; i < 8; i++)
{
data.Add(new { group = "Group 2", test = "Test " + i.ToString(), selected = (i % 2 == 0) ? true : false });
}
var responsive = new StoreResult();
responsive.Total = data.Count;
responsive.Data = data;
return responsive;
}
View code is :-
Code:
<script>
var onLoad = function(store, records, successful) {
var grid = App.GridPanel1,
view = grid.getView(),
sm = grid.getSelectionModel(),
recordsToSelect = Ext.Array.filter(records, function (r) { return r.data.selected; });
if (view.viewReady) {
sm.select(recordsToSelect);
} else {
view.on("viewready", function () { sm.select(recordsToSelect); });
}
};
function fnCheckboxSelect(e, record) {
alert("fnCheckboxSelect");
}
function fnCheckboxDeselect(e, record) {
alert("fnCheckboxDeselect");
}
var onGroupCommand = function (column, command, group) {
if (command === 'SelectGroup') {
column.grid.getSelectionModel().select(group.children, true);
return;
}
else if (command === 'DeselectGroup') {
column.grid.getSelectionModel().deselect(group.children, true);
return;
}
Ext.Msg.alert(command, 'Group name: ' + group.name + '<br/>Count - ' + group.children.length);
};
</script>
@(Html.X().GridPanel()
.ID("GridPanel1")
.Height(500)
.Store(Html.X().Store()
.GroupField("group")
.Model(model => model.Add(Html.X().Model()
.Fields(f =>
{
f.Add(Html.X().ModelField().Name("group"));
f.Add(Html.X().ModelField().Name("test"));
f.Add(Html.X().ModelField().Name("selected").Type(ModelFieldType.Boolean));
})))
.Proxy(Html.X().AjaxProxy()
.Url(Url.Action("GetData"))
.Reader(Html.X().JsonReader().Root("data"))
)
.Listeners(events => events.Load.Fn = "onLoad")
)
.SelectionModel(
Html.X().CheckboxSelectionModel()
.CheckOnly(true)
.Listeners(l =>
{
l.Select.Fn = "fnCheckboxSelect";
l.Deselect.Fn = "fnCheckboxDeselect";
})
)
.ColumnModel(
Html.X().Column()
.Text("Test")
.DataIndex("test"),
Html.X().CheckColumn()
.Text("Selected")
.DataIndex("selected"),
Html.X().CommandColumn()
.Hidden(true)
.GroupCommands(
Html.X().CommandFill(),
Html.X().GridCommand()
.Icon(Icon.TableRowInsert)
.CommandName("SelectGroup"),
Html.X().GridCommand()
.Icon(Icon.TableRowDelete)
.CommandName("DeselectGroup")
)
.Listeners(ls =>
ls.GroupCommand.Fn = "onGroupCommand"
)
)
.Features(
Html.X().Grouping()
.ID("TestGrouping")
.GroupHeaderTplString("{name} ({rows.length} Element{[values.rows.length > 1 ? 's' : '']})")
.HideGroupedHeader(true)
.EnableGroupingMenu(false)
.StartCollapsed(true),
Html.X().RowWrap()
)
)
