I have and igGrid and am trying to find use right way of getting the selected row(s), its index, and values of cells in that row. My GRID has this features :
features: [{ name: "RowSelectors", enableCheckBoxes: false, enableRowNumbering: true },{ name: "Selection", mode: "row", multipleSelection: false //rowSelectionChanged:rowSelection },{ name: "Sorting", firstSortDirection: "ascending", type: "local" }]
I went to this site example : http://www.igniteui.com/grid/grid-api-events and copied this code exactly :
var rows = $("#grid").igGridSelection("selectedRows"); apiViewer.log("The number of selected rows is: " + rows.length); $.each(rows, function (i, val) { apiViewer.log("Row with index " + val.index + " is selected"); });
and it doesnt work at all. I tried many things :
//var idx = document.getElementById("rsGrid")._selectedRow.index; // _selected_row undefined //var idx = $("#rsGrid")._selectedRow.index; // _selected_row undefined
var rows = $("#grid").igGridSelection("selectedRows"); // works?? $.each(rows, function (i, val) { var aa = "Row with index " + val.index + " is selected"; // val.index is undefined var cc = "Row with index " + val.index() + " is selected"; // 'index' is not a function var ID = $("#rsGrid").getCellValue(val.index, "idField"); // fails });
Other things that do NOT work :
var rows = $("#rsGrid").igGridSelection("selectedRows"); if ( rows.length != 1 ) { } // rows.length is ALWAYS 1
$('#rsGrid').igGridSelection('clearSelection'); // does NOT clear the selection
The ONLY thing I could get to work is this :
var grid = $("#rsGrid").data("igGrid"); var idx = grid._selectedRow.index; var ID = grid.getCellValue(grid._selectedRow.index, "idField");
which is not the right way of coding it, as it uses an undocumented attribute and will NOT work for a multiple selection grid.
What am I doing wrong and why doesnt this work??
Thank you.
Hello,
In order to obtain the selected row when multiple selection is disabled you have to use the selectedRow method:
$("#grid").igGridSelection("selectedRow");
If you enable multiple selection then the correct method to use will be selectedRows.
In the former case you'll get an object which will contain the row element selected, its ID if you have a primary key defined and its index. You can then use it to call getCellValue. As it is a public method you don't need to get the grid instance to use it. Instead you could do:
$("#grid").igGrid("getCellValue", <row id / row index>, <col key>);
Please, refer to the API documentation for more information regarding these functions. It's important to note that getCellValue will always consider the first parameter to be a row ID if you define a primary key for the grid (and index otherwise).
I hope this helps! Please, let me know if you have any other questions or concerns!
Best regards,
Stamen Stoychev
Well, I tried this and it didn't work either.
var row = $("#rsGrid").igGridSelection("selectedRow"); // works??
var idx = row.index; // idx = a function
var idx = row.index(); // sets to '8' no matter which row is selected
var ID = $("#rsGrid").igGrid("getCellValue", idx, "releaseSetId"); // Gets the ID of row 8, which wasn't selected.
$("#rsGrid").igGridSelection("clearSelection"); // This still doesn't work.
Why is this not working?
Thanks for any help.
I am attaching a sample demonstrating how to use the object selectedRow returns as input for getCellValue, as well as a working clearSelection call. Could you please modify the sample to better match your scenario and possibly reproduce the issue you are having so I can take a look?
I am looking forward to hearing from you!
I am not sure what the issue with 1) is. I created a small sample and each filter call was applying only the filter expressions specified. I am attaching it for your reference. To clear a filter you should use the same function but with an empty array for the filter expressions. You can find a sample of this in the attached file as well.
The second point looks like a bug and I have asked our engineering staff to examine it further. To ensure that it will receive attention, I have logged it in our internal tracking system with a Development ID of 178259. A support case is created on your behalf with number CAS-142098-K6H8L7 , so that you can be notified when the bug is fixed.
You can find your active cases under Account - Support Activity in our website. Select your ticket and go to Development Issues tab to view the status of related bugs.
As a temporary workaround you could use the filterDialogMaxHeight option instead. Set it to about 100px lower than what you'd want your optimal dialog height to be and it should provide you with both the required size and the buttons appearing without the need to resize once.
We are aware that an option for users to specify dropdowns instead of plain editors as input for filtering would be very helpful. I would still recommend you to log it as a product idea at http://ideas.infragistics.com though as it will help pushing it higher on the priority list for future releases.
Finally, regarding the struts form, it will be helpful if you could provide me with some markup to look at. Technically a struts form will still render a <form> element but will add various additional properties to it, as well as specific styling. It's very likely that some of these properties cause the issue you are having.
I also found out why my GRID (when attached to a <table> and NOT a <div>) was rendered outside of the fieldset, but you didn't see it. It happens when the fieldset and grid are within a <s:form>. If there is no s:form, the fieldset nicely surrounds the GRID. If there is a <s:form>, it shows up outside the fieldset box.
It works fine with a regular 'form', but not a struts form (s:form)
I'd like to use the standard <table> element so I can access grid methods normally, but then I can't use the fieldset. Any hints or ideas?
OK, I looked into filtering and it looks pretty good. However there is still some things that are hindering me.
1) When I have a button call
$("#rsGrid").igGridFiltering("filter", [ { fieldName: "phase", cond: "equals", expr: "value", logic: "AND" }], true);
it works fine, but when I click another button which filters PHASE on a different value, BOTH filters are still enforced, so my grid becomes empty. I've been looking for a programmatic way to 'CLEAR' all filters before applying the new one, but haven't found anything. How can I achieve this?
2) Since its available, in addition to my buttons, I'd like to allow the 'Advanced Filter dialog for users. However when it pops up on the screen, if it is less than 430px, the SEARCH/CANCEL buttons do not show on the dialog. 430px is already too large - the user doesn't need room for 8 or so filters. Even if I set the
filterDialogMaxFilterCount to 3, the dialog still has to be huge for the buttons to show up. In all cases, as soon as I resize the dialog with the mouse, the buttons immediately snap into place, easily fitting on a nice 300px dialog box. How can I fix this?
3) As a 'would be nice to have' for filtering - the filter should be able to be configured to offer a drop down list of the values of that column, instead of 'startsWith', 'endsWith' etc that require the user to type. If the create filter list could contain JUST the values in the column, then no typing would be needed, just mouse clicks.
Thanks
Sure, all you'll have to do is hide Filtering's UI. To do this you should define the feature with filterSummaryAlwaysVisible: false. After the grid is rendered you'll also have to hide the filter row:
$("#grid").igGrid("headersTable").find(".ui-iggrid-filterrow").hide();
We are planning to add an option for this in future versions.
I hope this helps!
I have only 1 minute to reply but wanted to ask - I saw the 'Filtering' feature, but it seemed geared only towards the USER choosing what to filter. I simply want a button to filter it for them - no other clicking/typing on their part.
Can I use the FILTERING feature internally/programmatically with the user NOT seeing it and NOT having to do anything else?
Thanks and I'll look at the other answers shortly.