querySelector returns Null or undefined for childNodes
Application Type

Hi All,

I'm trying to generate highcharts using JS script passed through client action. I have certain containers on screen (in nested format), and I'm passing the container's id as first parameter in Highcharts. Issue is that it is returning me undefined or null. I tried to pass the same code in browser console, but here it gives me proper results. 

JS Script : (here i also tried to console.log the child nodes as first statement gave me error)

error in console (please see the bottom most lines where I used the above code - it gave me the id, also undefined which I do not understand).

I've tried a lot of ways - getElementById() then getAttributes('id'), getElementByClassName() and above way using query selector but it just doesn't work. 

Thank You,

Aman Devrath

Hi Aman,

first of all, let me say that what you are doing looks very fragile, and needlessly complicated.  Trying to find a given element by a long path of childnodes is asking for trouble.  If you feel that using the chart widgets of Outsystems isn't good enough for you, at least give the div where you want the chart an id or class, and select on that in your javascript code.

But that's not what your question is about.  As you say that the selector works in the console, my guess would be that you are trying to do this too early.  Are you doing it in the onInitialize ?  At that point, your dom is not built yet, move it to the OnReady.

Also, if the div you are trying to reach depends on data returned from a fetch (such as part of a list), than the OnReady might still be too soon, you'll have to do something with OnAfterFetch or OnRender instead.


Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.