Thank you for that - your solution worked. I must have missed something, or not correctly made a change the first few times I did it, but after following your demo (and building the code in the direction you suggested) it works as expected.
There is an additional, but linked, issue.
Our grid gives the user the ability to save their grid.options to the database, and then call them back upon request. When any grid data is loaded, the select all header checkbox functionality stops. It checks itself, as expected, but does not select any (or all) of the rows in the grid. Here's a look at how we make and get the options:
function saveUserGridOptions(options) {
var paramdata = { reportId: pageId, options: JSON.stringify(options) };
$.ajax({
url: getPathToRoot() +
"CommonSubReports/SaveGridOptions"
,
type:
'POST'
,
contentType:
'application/json; charset=utf-8'
,
dataType:
"json"
,
data: JSON.stringify({
reportId: paramdata.reportId,
options: paramdata.options
}),
complete: function (data) {
if
(data.responseJSON.IsSuccess ==
true
) {
ShowNotification(data.responseJSON.Message, NotificationTemplate.Success);
}
else
{
ShowNotification(data.responseJSON.Message, NotificationTemplate.Error);
}
},
error: function (jqXHR, textStatus, errorThrown) {
ShowNotification(errorThrown, NotificationTemplate.Error);
}
});
}
function getSavedGridOptions(grid) {
var paramdata = { reportId: pageId };
$.hideWait();
$.ajax({
url: getPathToRoot() +
"CommonSubReports/LoadGridOptions"
,
type:
'GET'
,
contentType:
'application/json; charset=utf-8'
,
dataType:
'json'
,
data: paramdata,
complete: function (data) {
$.hideWait();
if
(data.responseJSON.IsSuccess ==
true
) {
sendGridSavedOptions(data.responseJSON.Message, grid);
ShowNotification(
"Your grid options were successfully loaded"
, NotificationTemplate.Success);
}
else
{
ShowNotification(data.responseJSON.Message, NotificationTemplate.Error);
}
},
error: function (jqXHR, textStatus, errorThrown) {
ShowNotification(errorThrown, NotificationTemplate.Error);
}
});
}
function sendGridSavedOptions(_options, grid) {
var loaded_state = JSON.parse(_options);
if
(loaded_state) {
var options = grid.options;
grid.setOptions({ columns: loaded_state.columns });
}
}
The options save and load correctly - what might be causing the header checkbox to lose functionality?