How to leverage the FuelUX DataGrid "loaded" event?

Question

I need to bind a click event to <a> tags in a FuelUX DataGrid column that are dynamically added via a custom formatter.

The formatter is working as expected, however, I'm not sure how I should go about binding the click event handler. I would prefer to do so in an unobtrusive way.

The DataGrid is supposed to have a "loaded" event hook, but there isn't an example of how to use this event. Can someone please point me to an example? Google is coming up short for me.

The only reference I can find to the event is on 163 of datagrid.js:

self.$element.trigger('loaded');

I'm assuming that means I need to define a "loaded" function on the object, but where/how? My DataGrid is:

$('#jobs').datagrid({
    dataSource: dataSource,
    itemsText: 'Available Positions',
    itemText: 'Available Position';
});

score 5 · Accepted Answer · answered Apr 11 '13 at 01:25

After looking up the reference for .trigger() in the jQuery API, all I needed to do was add an 'on' handler to the datagrid:

$('#jobs').datagrid({
    dataSource: dataSource,
    itemsText: 'Available Positions',
    itemText: 'Available Position';
}).on('loaded', function() {
    console.log('DataGrid loaded');
);

How to leverage the FuelUX DataGrid "loaded" event?

1 Answers1