this.$el and jQuery

Question

I'm trying to do something deceptively simple -- adding a class to the active backbone element. The code I want to use is:

 this.$el.addClass('classIWant');

However, this doesn't work all the time. Sometimes it seems to, but not all the time. However, this always works.

 var id = this.$el.attr('id');

 $('#' + id).addClass('classIWant');

Obviously I don't want the second example, as it relies so heavily on HTML and the DOM. Is there any reason why the first shouldn't work, or am I missing something else?

I see no reason the second should work while the first does not. — Matt Ball, Jul 12 '13 at 17:16
Are you sure that you're calling the container method with the right context (the `this` variable)? — gustavohenke, Jul 12 '13 at 17:18
You might be hitting a race condition. Please post your complete code — Bojangles, Jul 12 '13 at 17:22
Wouldn't you happen to have several elements with the same id? That's the only thing I can think of that would match your problem. — Loamhoof, Jul 12 '13 at 17:40
I shouldn't, as the ID is a unique ID. @JoeBeuckman, I logged 'this', and all looks normal -- it's the actual element, and I can't seem to find anything wrong or out of the normal with it — streetlight, Jul 12 '13 at 17:45
if `this` is an element then there is certainly something wrong, `this` should be an instance of Backbone.View — Alexander Petrovich, Jul 12 '13 at 17:49
Can you provide the full structure of the rest of the code so that we can see how it fits into the the view? — Ming Chan, Jul 12 '13 at 18:45
Have you solved the problem already? Let us know what was wrong! — Artem Volkhin, Jul 12 '13 at 19:21
What is the problem exactly? You get an error or it doesn't add the class? — chchrist, Jul 13 '13 at 20:19

score 1 · Answer 1 · answered Jul 12 '13 at 17:32

1

Seems this points to something wrong. If you are running this code in function myFunc, then just add to initialize next line:

_.bindAll(this, 'myFunc');

And got with you first approach, this.$el.addClass('classYouWant').

answered Jul 12 '13 at 17:32

Artem Volkhin

1,362
8
22

If `this` points to something wrong, why would `this.$el.attr('id');` work? – Loamhoof Jul 12 '13 at 17:39

score 0 · Answer 2 · answered Jul 17 '13 at 01:36

This code should work:

this.$el.addClass('classIWant');

but only if it is present within your onRender() function or any functions that are called after onRender() is. If you have this code in your initialize function then it will not work as the dom for that view has not yet been generated

this.$el and jQuery

2 Answers2