John Herdean
Posts: 0
Joined: Tue May 14, 2013 3:56 am

How to display the label selected from a selectmenu on another screen?

I have a select menu with several options. I have values and the corresponding labels. On such page, I submit a json post to my server to store just the values inputted. HOwever, I want to at the same time when invoking such service to change the content of a label on a different page to represent the selected label (not the value, but just the label) of said select menu. How would I do that?

John Herdean
Posts: 0
Joined: Tue May 14, 2013 3:56 am

How to display the label selected from a selectmenu on another screen?

i already know how to save the selected value, store it in local storage, and load it. But it only shows the value, not the Label. So, Im guessing I wouild have to JS to it, but when i go to the local storage item it doesnt allow you to add any JS unless you map it to a parameter??

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

How to display the label selected from a selectmenu on another screen?

Hello! You should use JS to save data into localStorage:

codevar selectLabel = Appery("mobileselectmenuName").find("option:selected").text();
localStorage.setItem("selectLabel", selectLabel);/code
To get data from localStorage and save it to Label on page Show event run the following code:
codeAppery("mobilelabelName").text(localStorage.getItem("selectLabel"));/code

John Herdean
Posts: 0
Joined: Tue May 14, 2013 3:56 am

How to display the label selected from a selectmenu on another screen?

does "selectLabel" refer to the local storage variable im using?

John Herdean
Posts: 0
Joined: Tue May 14, 2013 3:56 am

How to display the label selected from a selectmenu on another screen?

yes I guess its working. Thanks

John Herdean
Posts: 0
Joined: Tue May 14, 2013 3:56 am

How to display the label selected from a selectmenu on another screen?

Hi again, actually I just realized that if the user logs in for the first time they will see 'null' in those labels... How can hide 'null'? or just keep the value empty until the user selects something?

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

How to display the label selected from a selectmenu on another screen?

Hello! Sorry for late reply. Please use
codeif (localStorage.getItem("selectLabel") != null) {
Appery("mobilelabelName").text(localStorage.getItem("selectLabel"));
}/code
instead of
codeAppery("mobilelabelName").text(localStorage.getItem("selectLabel"));/code

John Herdean
Posts: 0
Joined: Tue May 14, 2013 3:56 am

How to display the label selected from a selectmenu on another screen?

thanks Marina, your awesome...:)

Brandon Scott Barney
Posts: 0
Joined: Fri Jun 14, 2013 4:49 pm

How to display the label selected from a selectmenu on another screen?

Dear Marina:

Thank you for all your help in these forums. I've been reading through your responses and I'm afraid that you've probably addressed my question from a few different angles, but I still appreciate your help.

I have 7 screens in the application I'm making that I'm having trouble with (I think I know what I want to do but am having a problem with the syntax since I'm new to HTML/CSS/Java development):

The first screen is the GameSelect screen with an input component and two buttons; one button quits the game and the other button is supposed to be pressed after a user inputs a number between 1-200 into the Input component. I have followed the included HelloWorld tutorial and use the same process to have the Input component on the first screen save the input to a local variable. I then have attempted to use the Javascript Switch(n) command to take the Input number and create and save it as the GameNumber and also 6 words to local storage and then save those six words to 6 different labels that appear individually, one after another, on the 6 subsequent screens. The GameNumber (1-200) that was inputted should appear on each of the 6 screens. The other 6 words appear one after another below the GameNumber on each of the subsequent six screens.

The second screen has two label components and two buttons. One of the label components should display the GameNumber that was inputted on the GameSelect screen and the other label component should display the first of the six words that was saved to local storage when the GameNumber was inputted. The second screen should also have two buttons and the first button should take you to the next/third screen and the second button should take you to the final/seventh screen.

The third screen has two label components and two buttons. One of the label components should display the GameNumber that was inputted on the GameSelect screen and the other label component should display the second of the six words that was saved to local storage when the GameNumber was inputted. The third screen should also have two buttons and the first button should take you to the next/fourth screen and the second button should take you to the final/seventh screen.

The fourth screen has two label components and two buttons. One of the label components should display the GameNumber that was inputted on the GameSelect screen and the other label component should display the third of the six words that was saved to local storage when the GameNumber was inputted. The fourth screen should also have two buttons and the first button should take you to the next/fifth screen and the second button should take you to the final/seventh screen.

The fifth screen has two label components and two buttons. One of the label components should display the GameNumber that was inputted on the GameSelect screen and the other label component should display the fourth of the six words that was saved to local storage when the GameNumber was inputted. The fifth screen should also have two buttons and the first button should take you to the next/sixth screen and the second button should take you to the final/seventh screen.

The sixth screen has two label components and two buttons. One of the label components should display the GameNumber that was inputted on the GameSelect screen and the other label component should display the fifth of the six words that was saved to local storage when the GameNumber was inputted. The sixth screen should also have two buttons and the first button should take you to the next/seventh screen and the second button should (also) take you to the final/seventh screen.

The seventh/final/answer screen has two label components and two buttons. One of the label components should display the GameNumber that was inputted on the GameSelect screen and the other label component should display the sixth of the six words that was saved to local storage when the GameNumber was inputted. The seventh/final/answer screen should also have two buttons and the first button should take you back to the beginning, the GameSelect screen, and the second button should take you to the GameQuit screen.

For more information, there are 200 puzzles that each have a GameNumber (1-200) and six words: five clues and one answer, all text strings with 1, 2 or 3 words, associated and this is a simple word association application that is designed to be played with a physical board game and DVD that is designed to be played on a large living room television.

I used the Switch command (http://www.w3schools.com/js/js_switch...) because I have 200 puzzles each with a GameNumber (1-200) and each puzzle has five clue word/phrases and one answer word/phrase and I concluded after reviewing the tutorials that on the GameSelect screen running custom Javascript that creates seven local storage variables based on the number and the six associated words/phrases as strings that are then saved to labels which are displayed on the subsequent screens.

The name of the labels are "GameNumber, ClueLabel1, ClueLabel2, ClueLabel3, ClueLabel4, ClueLabel5, GameAnswer"

I saw above that you advised custom javascript for local storage so here is the code that I've generated for saving the GameNumber and storing the data into local variables based on that game number:

var GameNumber = Appery("GameNumber").find("option:selected").text();
localStorage.setItem("GameNumber", GameNumber);
switch(GameNumber){
case 1:
localStorage.setItem("GameNumber", '001');
localStorage.setItem("ClueLabel1", 'GENESIS');
localStorage.setItem("ClueLabel2", 'EXODUS');
localStorage.setItem("ClueLabel3", 'LEVITICUS');
localStorage.setItem("ClueLabel4", 'NUMBERS');
localStorage.setItem("ClueLabel5", 'DEUTERONOMY');
localStorage.setItem("GameAnswer", 'THE PENTATEUCH OR TORAH');
break;
case 2:
localStorage.setItem("GameNumber", '002');
localStorage.setItem("ClueLabel1", 'MATTHEW');
localStorage.setItem("ClueLabel2", 'MARK');
localStorage.setItem("ClueLabel3", 'LUKE');
localStorage.setItem("ClueLabel4", 'JOHN');
localStorage.setItem("ClueLabel5", 'NEWS');
localStorage.setItem("GameAnswer", 'THE GOSPELS');
break;
default:
localStorage.setItem("GameNumber", '999');
localStorage.setItem("ClueLabel1", 'SELECT GAME 1-2');
localStorage.setItem("ClueLabel2", 'SELECT GAME 1-2');
localStorage.setItem("ClueLabel3", 'SELECT GAME 1-2');
localStorage.setItem("ClueLabel4", 'SELECT GAME 1-2');
localStorage.setItem("ClueLabel5", 'SELECT GAME 1-2');
localStorage.setItem("GameAnswer", 'SELECT GAME 1-2');
}

Each of the six screens should display on load the GameNumber in the GameNumber label and the correct text clue in the ClueLabel.

On the second screen (first clue screen):

Appery("GameNumber").text(localStorage.getItem("GameNumber"));
Appery("ClueLabel1").text(localStorage.getItem("ClueLabel1"));

On the third screen (second clue screen):

Appery("GameNumber").text(localStorage.getItem("GameNumber"));
Appery("ClueLabel12").text(localStorage.getItem("ClueLabel2"));

On the fourth screen (third clue screen):

Appery("GameNumber").text(localStorage.getItem("GameNumber"));
Appery("ClueLabel13").text(localStorage.getItem("ClueLabel3"));

On the fifth screen (fourth clue screen):

Appery("GameNumber").text(localStorage.getItem("GameNumber"));
Appery("ClueLabel14").text(localStorage.getItem("ClueLabel4"));

On the sixth screen (fifth clue screen):

Appery("GameNumber").text(localStorage.getItem("GameNumber"));
Appery("ClueLabel15").text(localStorage.getItem("ClueLabel5"));

On the seventh/answer screen:

Appery("GameNumber").text(localStorage.getItem("GameNumber"));
Appery("GameAnswer").text(localStorage.getItem("GameAnswer"));

Of course...this isn't working correctly, could you help me?

Dropbox link to a folder with the full UI in .pdf and the word list also in .pdf:
https://www.dropbox.com/sh/sd4w4qebde...

I'm working on a great story about Appery and how powerful the tool that you are working on and I appreciate your help. Thank you!

Best,

Brandon Barney
Producer and Co-Host
310-571-8553 direct
a href="mailto:brandon@digitalculture.la" rel="nofollow"brandon@digitalculture.la/a
Digital Village Radio
Saturdays 10:00-11:00 AM Pacific Time
KPFK/Pacifica (90.7/93.7/98.7/99.5 FM)
Los Angeles/San Diego/Santa Barbara/China Lake
http://www.DigitalCulture.LA.

*********************************************
Igor
Posts: 0
Joined: Tue Apr 02, 2013 12:05 pm

How to display the label selected from a selectmenu on another screen?

Brandon,

I have sent you email.

Return to “Issues”