Unable to select grid item using SmartTable in Angular JS

Question

I implemented a grid using SmartTable in Angular JS. According to the Smart Table docs, to select a grid item we need to add st-select-row="row" . I added this one too. But I can not select the grid.

The implemented application can be seen in plunk (url below). Can someone help me use the grid row as selectable . In addition, I want to call a function when clicking in a line .

Plunkr here

Answer 1

Your pluker really works

when selecting a row smart table, add the property isSelected=true to the associated model and the class name st-selected in the tr element

just add a css rule and you can see it

 .st-selected{ border-left:4px solid black; } 

Answer 2

 app.controller('selectionCtrl', ['$scope', '$filter', function (scope, filter) { scope.rowCollection = [ {firstName: 'Laurent', lastName: 'Renard', birthDate: new Date('1987-05-21'), balance: 102, email: '[e-mail]'}, {firstName: 'Blandine', lastName: 'Faivre', birthDate: new Date('1987-04-25'), balance: -2323.22, email: '[e-mail]'}, {firstName: 'Francoise', lastName: 'Frere', birthDate: new Date('1955-08-27'), balance: 42343, email: '[e-mail]'} ]; }]); 

 .st-selected{ color:cornflowerblue ; } 

 <table st-table="rowCollection" class="table"> <thead> <tr> <th st-sort="firstName">first name</th> <th st-sort="lastName">last name</th> <th st-sort="birthDate">birth date</th> <th st-sort="balance">balance</th> <th>email</th> </tr> </thead> <tbody> <tr st-select-row="row" st-select-mode="multiple" ng-repeat="row in rowCollection"> <td>{{row.firstName | uppercase}}</td> <td>{{row.lastName}}</td> <td>{{row.birthDate | date}}</td> <td>{{row.balance | currency}}</td> <td><a ng-href="mailto:{{row.email}}">email</a></td> </tr> </tbody> </table>