Dave
Dave

Reputation: 5029

Getting id from row clicked on a dgrid List

I just started using dgrid, and going through the dTunes sample, I'm unable to find the id associated with each row in the list. This is pretty remedial on my part, but how would I also get the id I sent from the datasource?

 define([
'require',
'dgrid/List',
'dgrid/OnDemandGrid',
'dgrid/Selection',
'dgrid/Keyboard',
'dgrid/extensions/ColumnHider',
'dojo/_base/declare',
'dojo/_base/array',
'dojo/Stateful',
'dojo/when',
'dstore/RequestMemory',
'put-selector/put',
'dojo/domReady!'
 ], function (require, List, Grid, Selection, 
        Keyboard, Hider, declare, arrayUtil, Stateful, 
        when, RequestMemory, put) {

 var cstsNode = put(listNode, 'div#cstsCars');
 ...

var cstsList = new TunesList({}, cstsNode);
var dataCSTS = new RequestMemory({ target: require.toUrl('./dataCSTS.json') });

...

dataCSTS.fetch().then(function (cars) {
    cstsCars = arrayUtil.map(cars, pickField('Description'));
    cstsCars.unshift('All (' + cstsCars.length + ' CSTS Cars' + (cstsCars.length !== 1 ? 's' : '') + ')');
    cstsList.renderArray(cstsCars);
});

...

cstsList.on('dgrid-select', function (event) {
    var row = event.rows[0];
    console.log(row.id);  // shows row number.  How do I get the real id or other fields?
    console.log(row.data);  // shows row text that is displayed ("sample text 1")
    console.log(row.data.id); // undefined
});

Here is a snippet of sample data like I'm supplying:

 [{"id":"221","Description":"sample text 1"},
 {"id":"222","Description":"sample text 2"}, 
 {"id":"223","Description":"sample text 3"}]

I'd like to see the id. Instead, row.id returns 1,2 and 3, ie the row numbers (or id dgrid created?).

Upvotes: 0

Views: 1568

Answers (2)

Dave
Dave

Reputation: 5029

I think the problem might be that I was modeling my code based on the dTunes sample code, which has 3 lists that behave a little differently than a regular grid.

For now, I'm using the cachingStore that is available in the lists. So the way I get the id:

cstsList.on('dgrid-select', function (event) {
    var row = event.rows[0];
    var id = storeCSTS.cachingStore.data[row.id - 1].id; // -1 because a header was added
    console.log(id);
});

I'm not sure whether this will work if I ever try to do sorting.

Upvotes: 0

Ken Franqueiro
Ken Franqueiro

Reputation: 10559

You haven't really shown a complete example, but given that you're using a store anyway, you'd have a much easier time if you let dgrid manage querying the store for you. If you use dgrid/OnDemandList (or dgrid/List plus dgrid/extensions/Pagination), you can pass your dataCSTS store to the collection property, it will render it all for you, and it will properly pick up your IDs (since Memory, and RequestMemory by extension, default to using id as their identity property).

The most appropriate place to do what you're currently doing prior to renderArray would probably be in the renderRow method if you're just using List, not Grid. (The default in List just returns a div with a text node containing whatever is passed to it; you'll be passing an object, so you'd want to dig out whatever property you actually want to display, first.)

If you want a header row, consider setting showHeader: true and implementing renderHeader. (This is false in List by default, but Grid sets it to true and implements it.)

You might want to check out the Grids and Stores tutorial.

Upvotes: 1

Related Questions