I am having a problem with the select all feature of the row selectors.
If I chose the select all checkbox in the rowselector-header it selects all of the rows but when I create an alert function to alert the ui.rowKey for each selected row on the page, I get an error.
Is there any way to hide the select all checkbox in the header of the grid?
function createGrid(d)
{
$("#sourceInfo").igGrid({
autoGenerateColumns: false, dataSource: d, dataSourceType: "json", primaryKey: "SourceID", width: "1024px", height: "500px", columns: [ { headerText: "Source Information", group: [ { headerText: "Source ID", key: "SourceID", dataType: "number" }, { headerText: "Session ID", key: "SessionID", dataType: "number"}, { headerText: "Source Name", key: "SourceName", dataType: "string" }, { headerText: "Title", key: "Title", dataType: "string"}, { headerText: "Source File Name", key: "SourceFileName", dataType: "string" }, { headerText: "Source Created Date", key: "SourceCreated", dataType: "date", format: "MM/dd/yyyy HH:mm tt" }, { headerText: "Custodian Name", key: "CustodianName", dataType: "string" }, { headerText: "Item Total", key: "ItemTotal", dataType: "number"}, { headerText: "Session Created Date", key: "SessionCreated", dataType: "date", format: "MM/dd/yyyy HH:mm tt" } ] }], features: [ { name: "MultiColumnHeaders" }, { name: "Filtering", type: "local", mode: "advanced" }, { name: 'Paging', type: "local", pageSize: 10 }, { name: 'RowSelectors', enableCheckBoxes: true, enableRowNumbering: false, showCheckBoxesOnFocus: false, checkBoxStateChanged: function (evt, ui) { if (ui.state == "on") { selectedSourcesArray.push(ui.rowKey); } else { selectedSourcesArray = jQuery.grep(selectedSourcesArray, function (value) { return value != ui.rowKey; }); } } }, { name: "Selection", multipleSelection: true, } ] });
}
Also, I've tried to theme just the rowselector section of my grid and I cannot seem to get it to work. I've tried using this code below but not really sure what I should be using in order to make the checkbox smaller in the grid.
.ui-iggrid-rowselector-class{font-size:9px!important;align-content: center;}