1

In this fiddle I'm attempting to fire an alert within a <tr> element when the item is clicked :

http://jsfiddle.net/q8r4e/503/

Code : 

<tr ng-controller="MyController" ng-click="alert()">alert
</tr>

function MyController($scope) {

    $scope.alert = function() {
        alert('here');
    };

}

But nothing is being fired. Is this possible within angular? The reason I'm attempting to use with <tr> is that I'm attempting to introduce AngularJS indo code base and im starting with listeners within a table.

Mathew Berg
  • 28,625
  • 11
  • 69
  • 90
blue-sky
  • 51,962
  • 152
  • 427
  • 752

1 Answers1

3

Couple of issues I can see, one is that you're in a tr, but your alert text is not in a td, so that would be the main one, if you fix that it should work. Try doing this:

<tr ng-click="alert()"><td>alert</td></tr>

Here's a code demonstrating http://jsfiddle.net/6L4Kz/

Mathew Berg
  • 28,625
  • 11
  • 69
  • 90
  • 1
    Angular can picky about invalid html, good catch on the text not being in a `td`. You may point out that it isn't necessary to place the controller on a wrapper, it could just as easily be on the tr. – lucuma Jun 11 '14 at 15:55
  • I've seen a few questions about ng-repeat not working when trying to build a table and the reason sometimes is invalid html inside a tr or td or a div inside a tbody. http://stackoverflow.com/questions/23206641/angularjs-displaying-different-number-of-td-elems-in-each-tr-using-ng-repeat-and – lucuma Jun 11 '14 at 16:29