NealR NealR - 1 year ago 459
AngularJS Question

Get parent element in Angular directive

I'm attempting to find the parent

element when I use clicks a button on a
calendar. Since I don't want to use jQuery in my Angular app, and this isn't possible using strictly CSS, I created the directive below. The
is able to find and alter the css of the button correctly, so I know that I've found the element I'm looking for, however now I need to travel up the DOM.

I'm used to jQuery syntax, which doesn't work, and I haven't been able to find anything effective on the interwebs. Any chance someone could help me out with the syntax?

/* Linker for the directive */
var linker = function (scope, elm, attrs) {
elm.on('click', function() {
elm.find('table tbody tr').parent('td').css('background-color', 'red');


This is a directive that needs to be placed on a
element (Angular UI Bootstrap) in order to change alter the background-color for an entire row. The framework doesn't come with this functionality and the HTML isn't generated until the page loads.

I need to attach the directive to the element below, find the selected item and then work back up the DOM to find the parent

<uib-datepicker highlightselectedrow class="well well-sm" ></uib-datepicker>

Answer Source

.parent will look exact the upper element only. I'd say that rather use .closest so it will search in parent till it gets td

elm.find('table tbody tr')
.closest('td').css('background-color', 'red');
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download