@David-Hope Are you selecting the element by class name ? If so, it might be similar to my problem where the DOM elements of previously pushed pages are still present but only hidden.
If you’re using jQuery, try doing $('.yourClass:last').on... and see if the problems persists.
Thanks for your replies. @Fran-Diox, I had also tried calling the method in the postPush event before doing the then function.
Now I noticed this problem again with form inputs. Here’s an example:
document.getElementsByClassName('postText').length // returns 1 when the page is first loaded
document.getElementsByClassName('postText').length // returns 2 when the page is loaded again.
For the time being I can simply select the last element by class name, but I’m afraid of performance drawbacks. Plus, the “clever hacks” in the code are too much.
Would using the events solve this problem ?
@rgins16 Thanks for your reply. I think I don’t exactly have the same problem as you, since resetToPage() keeps working fine for me.
@David-Hope I thank you wholeheartedly. This is it. Any idea why this happens though? I think it’s crucial to add it as a note in the documentation if this is how things are intended to be.
Hello,
I can’t seem to find the source of this problem. The thing is, after I push a few pages to the navigator, the scripts that are responsible for adding dynamic DOM elements to pages suddenly stop working. They work again when I reset the navigator’s page stack.
To start, here’s my main page:
https://pastebin.com/bQrA9QuY
As you can see, all scripts are included in the main page.
Now, using the splitter’s side menu, I go to the “addPost.html” page.
Here’s the splitter’s side HTML: https://pastebin.com/ZFqvFRtm
And here’s the JavaScript file containing the fn.load function and other navigator functions: https://pastebin.com/L2JSAksP
Now, after being in the addPost.html page, I click on a button which triggers the “addPost()” function in this script (https://pastebin.com/zLfxu3gK).
On line 41, I load the “selectPostCategory.html” page alongside a function that fills an ons-list with ons-list-items loaded from a server (https://pastebin.com/AasP4m71).
On line 70, I load the categories main page (https://pastebin.com/FESAZ6VN - Ignore the fn.with functions, they’re deprecated). Then I click on “Add Categories”, and the page is loaded. Inside the “Add Categories” page, the following function is called (https://pastebin.com/WnjzZfuw) which populates the ons-list with ons-list-items.
Now, at some point, the rendering functions stop working. Here’s one case:
1- Go to addPost.html. Clicking on a button calls the addPost() function and redirects us to “selectPostCategory.html” with which a function is called to populate an ons-list with items.
2-Now being in “selectPostCategory.html” with a successfully populated list, we go to the “categories main page” and click choose “Add Category”.
3-Now being in “Add Category”, we notice that the function responsible for populating the ons-list with items does nothing despite being called. I also tried calling it manually from the browser’s console. On the other hand, when I go to “Add Category” without doing step 1 and 2 (or by calling fn.reset()), the function responsible for rendering the categories in “Add Category” works perfectly.
It seems this is the best I can explain this cumbersome problem, so thank you if you’ve made it this far.
Peace.