I'm using this method igGridSelection('selectedRows') to get the selected rows, but it does not return all the selected rows when using the grid's paging feature. It looks like it only returns the selectedRows for the current page. I'm using the EnableCheckBoxes feature to display a checkbox on the row, and I would like to get all the rows with the checkbox checked on all the pages.
Thanks
A developer here wanted to do the same thing and I believe the answer was that you needed to manage that on your own. Most of the API's only work with the current page or result set. What you need to do is hook into the page change 'ing' event and capture which items are selected before the page changes.
Then when you want work that subset of data, you'll need to base it off of the what you have locally. He was able to achieve the same effect without much effort.
Can you please share the sample code ? I'm having a hard time implementing this functionality.
Hello,
One possible approach is using a global variable which keeps an array of the currently selected records. When new records are added to the selection the rowSelectionChanged event is handled and the array is updated with them:
$("#grid1").igGrid({
features: [
{
name: "Selection",
mode: "row",
rowSelectionChanged: function (evt, ui) {
selectedRowsKeeper.push(ui.row);
…
}
]
});
It is also needed the pageIndexChanged event to be handled in order the rows from previous pages to be reselected again:
$(".selector").igGrid({
features: [{
name: "Paging",
pageIndexChanged: function (evt, ui) {
var l = selectedRowsKeeper.length;
for (var i = 0; i < l; i++)
$(this).igGridSelection(“selectRow”, selectedRowKeeper[i].index);
}]
If you need any further assistance please let me know.
I'm having the same issue, however, I'm using MVC Razor. Can you please provide this solution in Razor syntax? Thanks.
Hello guys,
There is no specified Razor syntax to implement this approach. It is needed the events to be handled by javascript functions:
<script type="text/javascript">
var selectedProducts = [];
$(document).delegate("#grid1", "iggridselectionrowselectionchanged", function (evt, ui) {
var tmpPage = $("#grid1").igGridPaging("pageIndex");
var selectedProductshelper = $("#grid1").igGridSelection("selectedRows");
selectedProducts[tmpPage] = selectedProductshelper;
$(document).delegate("#grid1", "iggridpagingpageindexchanged", function (evt, ui) {
if (selectedProducts[tmpPage]) {
var l = selectedProducts[tmpPage].length;
for (var i = 0; i < l; i++) {
var r = selectedProducts[tmpPage][i].index;
$("#grid1").igGridSelection("selectRow", r);
else return;
})
</script>
The solution above collects the selected items in a matrix. Each array from it corresponds to a grid page. Since index numbers duplicates on different pages each row is defined both by its index number and the page number it is positioned on.
I have also attached the whole MVC project for you reference.
Hope this will help. If any further questions or concerns arise feel free to contact me again.
Hello Rajesh,
You can find my answer in the following forum thread: http://es.infragistics.com/community/forums/p/88078/438127.aspx#438127
Best regards,Martin PavlovInfragistics, Inc.
hi Martin,
I came across weird problem while using SelectionPersistence.js for filtering.
Here are the steps to reproduce problem.....
1. Selection a row
2. Filter(remote))(enter some characters in filter text box for any column)
3. Remove text from filter text box
4. Try to deselect a selected record.
5. I get the error when deselection row at row index 1:
Unhandled exception at line 366, column 12789 in http://cdn-na.infragistics.com/jquery/20132/latest/js/infragistics.lob.js
0x800a138f - Microsoft JScript runtime error: Unable to set value of the property '1': object is null or undefined
6. I do not get this error when I user selection with sorting. It is coming only with filtering.
7. I used IE 9(standard mode)
Here is my sample code
@(Html.Infragistics().Grid(Model.Customers.AsQueryable()) .ID("myIGrid") .Width("400px") .Height("300px") .AutoGenerateColumns(false) //.ResponseDataKey("Records") .PrimaryKey("ID") .Columns(column => { column.For(x => x.ID).HeaderText("ID").Width("20%"); column.For(x => x.Name).HeaderText("Name").Width("60%"); column.For(x => x.IsActive).HeaderText("IsActive").Width("20%"); }) .Features(feature => { feature.Sorting().Type(OpType.Remote); feature.Selection().Mode(SelectionMode.Row).MultipleSelection(true); feature.RowSelectors().EnableCheckBoxes(true).EnableRowNumbering(false); feature.Filtering().Type(OpType.Remote); })
.DataSourceUrl(Url.Action("GetAllC")) .DataBind() .Render() )
Rajesh Varade said:Can you please let me know how to find out total number of selectedRows in a grid while paging is enabled?
In the SelectionPersistence object I've exposed selectedRows API which will return all the PK values of the selected rows regardless of their visibility. You can then use the PK values with the igGrid.findRecordByKey in order to find the whole record from the data source. Please note that the igGridSelection.selectedRows API will return DOM TR elements, while the SelectionPersistence.selectedRows API will return only the PK values. That's because the invisible rows (when Paging is enabled) will not have DOM elements.
Hope this helps,Martin PavlovInfragistics, Inc.
Can you please let me know how to find out total number of selectedRows in a grid while paging is enabled?
As of now,
$("#myGrid").igGridSelection("selectedRows");
returns only selected rows on current page.
Thanks,
Rajesh
hello Martin,
It worked for me. Thank you very much.
I have an issue in using rendered and destroy events. how to define them with HTML.Infragistics helpers ?
As of now I added below code just after my grid definition block which is defined using HTML.Infragistics helpers.
var sp; $(function () { $("#Grid").igGrid({ rendered: function (evt, ui) { sp = SelectionPersistence(ui.owner); sp.enable(); }, destroy: function (evt, ui) { sp.disable(); } }); });
Thank you,