I am trying my hand on Lightning apps, trying to load jsTree library on a div of component. When i try component.get("tree"), I get undefined. "tree" is id of a div to load lib into it. Any solution?

  • 6
    can you post snippet of the code which you written?
    – anmrk
    Nov 7 '14 at 5:26

I suspect you are using id= instead of aura:id= In your Aura markup. Aura IDs solve some problems that have existing in the DOM ID world (flat big ball of mud space) by being local to the scope (app or component). This means there is no dom ID collision issue which is critical for any component based architecture layered on top of HTML, 99% of the time you'll want to use aura:id=.

The correct API to access a component (not the DOM element directly - we'll get to that in a second) is component.find(auraId) which returns a reference to the component with that aura:id. Everything in Aura is a component - even <div aura:id="myDiv"/> is actually something closer to <html:div aura:id="myDiv"/>.

After you get your hands on the component you can simply call .getElement() on it to finally retrieve the associated DOM subtree, like this:

var myDiv = component.find("myDiv").getElement();

With all of that I think we need to discuss the challenges often encountered with integrating at the DOM level - works fine and is totally supported but the lifecycle of Aura components/apps can make bootstrapping the external library more involved than you might be used to when you own the entire page.

  • 4
    NOTE: please do not use Component.get(auraId) as a substitute for Componenf.find() - .get() happens to "work" with an aura:id but that unsupported side effect has been removed in Spring '15. Component.find() has always been the supported way to find a child component by aura ID. Nov 7 '14 at 11:47

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.