Forum | Appery.io

Difficulty programmatically populating labels on changing pages (screens/windows).

Hi to the appery gang,

I'm wondering if you can help me out with a problem.

References:
ol
lihttp://pastebin.com/Mf1N5tkr/li
lishared code sent to a href="mailto:support@appery.io" rel="nofollow"support@appery.io/a/li
lihttp://youtu.be/hAl32VPdFHw/li
/ol

I have run into some difficulty.

I've written a function (primaryGameFlowRedirect) in my .js library (pageDirector) that sends users to different pages in my app (e.g. mainGamePage, enterLetterGamePage, gameOverPage, etc.).

In turn, this function calls another one (updateDynamicFields) which dynamically populates label content.

The function seems to work. I say this because it works for mainGamePage (only). However, I see the information being passed along correctly in the browser console.log to emall/em of the pages successfully.

During the debugging process, I added a temporary button to all of the pages on a hunch. The buttons call the updateDynamicFields function and... it works on all pages!

So... why doesn't the code running in the library work? It's the exact same code.

I've been spending hours looking for things using keywords like "focus" and "refresh" to see if it's not working because of that. It could be, but I haven't found anything to confirm this theory.

Would you mind providing me with any thoughts that you might have?

Best,

Jamie

Hi Jamie -

It's not very obvious where exactly this functions don't work?
You can try to force refresh page when the data has been transferred to the page as option.

Yes, I thought of that. That's in the actual code I originally sent along.

From original reference:

pre
for (var i=0;i label # -- [labelname (0)] / [label contents (1)]...

         Appery(pageDynamicLabelMatch[pageNumber][i][0]).text(pageDynamicLabelMatch[pageNumber][i][1]); 

         Appery(pageDynamicLabelMatch[pageNumber][i][0]).refresh();  // TEMPORARY LINE OF CODE - credit https://github.com/gfranko/jquery.selectBoxIt.js/issues/29 

         console.log("The " + pageDynamicLabelMatch[pageNumber][i][0] + " should be populated with the word(s) " + pageDynamicLabelMatch[pageNumber][i][1]); 

         Appery(GAMESTATUS[localAppIsItPlayersTurnAsAnInt].recommendedPage).refresh();  // TEMPORARY LINE OF CODE - DELETE THIS - FOR TESTING ONLY 

     }  // end of "for (var i=0;i/pre 

Do you have a suggestion about trying your force-refresh idea differently?

Hi Illya,

Further to my earlier reply to your suggestion (please see one post up) and to your suggestion, I added code that force-refreshes the page.

This actually "worsened" the situation since, on the page that works, the code strips out the dynamically-populated information. The "force refresh" code I used was:

pre
function refreshPage() {
$.mobile.changePage(
window.location.href,
{
allowSamePageTransition : true,
transition : 'none',
showLoadMsg : false,
reloadPage : true
}
);
}
/pre

I also tried:

pre
function refreshPage() {
jQuery.mobile.changePage(window.location.href, {
allowSamePageTransition: true,
transition: 'none',
reloadPage: true
});
}
/pre

Reference: http://scottwb.com/blog/2012/06/29/re...

Hello,

Please try to add following code into the label populate block:

pre
code
//Your code.
// page --> label # --> [labelname (0)] / [label contents (1)]...
Appery(pageDynamicLabelMatch[pageNumber][0]).text(pageDynamicLabelMatch[pageNumber][1]);

         //Debug code. 
         //If length == 0 -  there is no element by this selector and you populated value into nothing. 
         console.log("label length = " + Appery(pageDynamicLabelMatch[pageNumber][i][0]).length); 

/code
/pre

When you test you will see next result:

• if legends populated correctly,length will return "1";

• if legends populated incorrectly , length will return "0" - in such case - legends couldn't be found.

  Please make sure that you execute js function updateDynamicFields after page has been loaded. You should use Page load event handling for these functions.

Hi Igor,

Thank you for taking the time out to reply to this. Much appreciated.

I will give your suggestion a try.

I've been debugging this problem for quite some time now and last night I found something interesting: if I put a delay into the code between the time I move to a new page and the time I update the labels on that new page, the app works. It's almost as if you can't try to update the labels immediately after a page load.

In other words, this seems to connect with your comment that I should:

[quote:]execute js function updateDynamicFields after page has been loaded. You should use Page load event handling for these functions. [/quote]

I'm going to investigate both ideas further. Either way, I will reply back here with a progress report.

Jamie

References:
ul
lihttp://roberthahn.ca/articles/2007/02.../li
lihttp://www.w3schools.com/jsref/event_.../li
lihttp://www.w3schools.com/jquery/event.../li
lihttp://learn.jquery.com/using-jquery-.../li
/ul

Appery team,

Thanks for your help on this. Igor was correct in that this problem had to do with updating fields emafter/em the page was loaded. I couldn't get any of the legitimate functions to work (see previous post's preferences) so I built my own. The function prevents attempts to dynamically update labels on the page/screen until they're actually present and ready to be populated.

I think we can consider this inquiry closed.

Jamie