Hi,
I have a requirement where I will key in say some department Id in a text box and when I click a button it should open a popup with grid having list of department Ids and names.
While opening this modal we should also make sure if the department id keyed in Textbox is available then it should be checked and highlighted.
In my sample I am able to select that particular department however the checkbox is not getting checked.
Note: If I select any department ids which is available in the beginning of grid, it works fine, but if the department id matched to any row which is somewhere in middle or so it is not getting checked.
Thanks,
Veena
Hello Veena,
When using virtualization only the table cells belonging to visible columns are present in the HTML DOM structure. So it is not possible to check a row which is in the middle of the grid and is not present in the DOM.
In order to provide more insight and a possible implementation of this functionality, I will highly appreciate if you could send me your working sample or the code where you check for the id and apply checking and highlighting.
I will be happy to assist you on that.
Hi Hristo,
Thanks for the reply.
Is there a way I can use a css or any code snippet to check the checkbox when it come to visible area atleast? (guess we can use the rowsrendered event to do this)
Actually in row changing event we are just selecting the rows based on Ids.
preSelectGridRows =function ($grid, idsToBeSelected) {var dataView = $grid.data('igGrid').dataSource.dataView();
var matchedRowIndexes = [];
var key = $grid.igGrid("option", "primaryKey");
if (idsToBeSelected.length > 0) {
$.each(dataView,function (rowIndex, dataRow) {
$.each(idsToBeSelected,function (index, id) {
if (dataRow[key] === id) {
$grid.igGridSelection("selectRow", rowIndex);
}
});
},
Now the only issue with the sample is we are unable to check the checkboxes even if the row is selected.