Unable to target div id in ons-template

[StevieC]

I am modifying the ‘Splitter animations with navigator’ tutorial (http://tutorial.onsen.io/?framework=vanilla&category=Community tutorials&module=splitter_navigator)

I have added <div id=“userBoards”></div> to one of the templates. When that template is loaded I call some JS to insert some text into the #userBoards div. My JS does not seem to be able to detect the div in question though.

Please advise.

[Fran Diox]

@StevieC I guess the DOM is not ready by the time you try to access it. Check out this other tutorial and the init event.

[StevieC]

Hi Fran,
Yes. That appears to be it. Thanks.

It has thrown up another problem though.

Using the function: 'document.addEventListener(‘init’, function(event) {'
to handle each page loading works fine within the Monaca IDE (fires each time a page is loaded) but when run on my mobile phone (Android 4.1.2) it only fires the once (on app loading). I have included Crosswalk to see if that would help but it has not.

Any advice?

[StevieC]

Hi Fran,
I’ve changed the ‘init’ to ‘show’ and that appears to have fixed it.