AngularJS Smarttable - event on select

Francisco Correia picture Francisco Correia · Jan 20, 2015 · Viewed 10k times · Source

Is there a way to trigger an event on row select in AngularJS Smart Table?

This was a subject in other thread but still no answer to this point.

Unable to select the grid item using SmartTable in Angular JS

Answer

What-About-Bob picture What-About-Bob · Feb 18, 2015

I needed this functionality in order to show a panel whenever at least 1 row was selected. I originally set up a watch, but decided that was too expensive.

I ended up adding a callback inside the stSelectRow directive.

ng.module('smart-table')
  .directive('stSelectRow', function () {
    return {
      restrict: 'A',
      require: '^stTable',
      scope: {
          row: '=stSelectRow',
          callback: '&stSelected' // ADDED THIS
      },
      link: function (scope, element, attr, ctrl) {
        var mode = attr.stSelectMode || 'single';
        element.bind('click', function ($event) {
          scope.$apply(function () {
              ctrl.select(scope.row, mode, $event.shiftKey);
              scope.callback(); // AND THIS
          });
        });

        //***///
      }
    };
  });

I was then able to pass a function from my controller to the directive (note: you could pass the selected row back, I didn't need to)

tr ng-repeat="row in customerResultsTable" st-select-row="row" st-select-mode="multiple" st-selected="rowSelected()">

Referenced this post for help Callback function inside directive attr defined in different attr