Infragistics Jquery Grid primary key

Question

I am trying to do a row selection on my grid but am struggling on either setting or getting the datakey values as I can not find any documentation out there on it.

$("#divGrid").igGrid({
            columns: [
                { headerText: "@Manage.gridColumnEmployeeNumber", key: "EmployeeNumber" },
            ],
            dataKeyFields: "EmployeeNumber",  //Is this how you set the dataKeys?
            autoGenerateColumns: false,
            dataSource: jsonp,
            features: [
                {
                    name: "Selection",
                    rowSelectionChanging: rowSelectionChanging
                }
            ]
        });
    });

This does not work at all. How do I access my dataKey (primaryKey) in this section of code?

    function rowSelectionChanging(evt, ui) {
        if (confirm) {
            var rows = ui.getSelectedRows();
            var selectedRow = rows.getItem(0);
            var selectedDataKey = selectedRow.get_dataKey();

            alert(selectedDataKey);
        } else {
            return false;
        }
    }

Answer 1

[...] dataKeyFields: "EmployeeNumber", //Is this how you set the dataKeys? [...]

Close enough. It's actually 'primaryKey' like so:

[...]
primaryKey: "EmployeeNumber",
[...]

And for the second part I guess that's not obvious right away, however the row you get passed as an argument is the actual DOM TR element that is being selected and you can (as your current setup suggest) plainly pick the key form its cells like so:

var rowKey = $(ui.row.element).children().eq(0).text(); //may need to parse if int

Note: The eq() method takes zero based index and in terms of structure the child elements of the row are the cells. In you case the primary key column is the first (and only) and therefore has index 0.

Another approach I find more programmatic-friendly is to get the key straight from the data source (clearer to read and no need for parsing):

var rowKey = ui.owner.grid.dataSource.dataView()[ui.row.index].EmployeeNumber;

Note: 'owner' is the actual widget in charge of the event ( Selection) and it has a reference to your 'grid' and from there you can access the data source. To get the records use either '.data()' or '.dataView()' - the latter contains only the actual visible rows on which the index is based and should be used if any additional features are enabled ( paging, sorting, filtering..).

Here's the documentation page that (at the bottom) describes what the selection events provide - http://help.infragistics.com/NetAdvantage/jQuery/2012.1/CLR4.0?page=igGrid_Selection_Overview.html

And here's a full API reference: http://help.infragistics.com/jQuery/2012.1/ui.iggridselection#events - from here you can dig into any grid / grid feature / data source API and events have sample snippets with all useful parameters listed.

P.S. If the intent is not to control the users' selection, consider using the '-ed' event as in 'rowSelectionChanged' - parameters available are identical. The difference is the '-ing' is fired mid-selection and it blocks the UI, which can result in a not very responsive app if you add some more heavy logic.

Answer 2

try var rowKey = ui.owner.grid.options.primaryKeyValue;