Convert a Menu to a dropdown box?

[rmarsh]

How do I populate a dropdown box with menu options from a dynamic menu?

Meaning that the menu options can change based on the user and the section they are in. So I cannot hardcode the text in the dropdown box. I am able to get the first one to work but the .js script and the commas in the option list get tangled up and I have not been able to figure out the syntax to for options 2 - end.

I also had trouble labeling the element. Do I need to add a text label over top of it? Changing the value does not appear to do anything.

Thanks.

[Scott Klement]

I'm not sure that I understand what you mean by "dynamic menu". I'm guessing that you have a program (or maybe 3rd party software) that reads a database and based on it's contents puts out a screen with menu options for the user.

To convert something like this to a drop-down in Genie, you'd write JavaScript code that reads the menu options off of the screen, puts them into a variable (such as a JavaScript array) and hides them. Once it has all of the options, it'd use the JavaScript tp build a drop-down. It'd set up code to run when the option is selected from the drop-down that would take the choice the user selects and put it into the spot where the green-screen user would've keyed the option number, and (optionally) presses enter.

This is just a high-level description, of course... I can't give you more specific information since I'm not familiar with the screen.

To show us the screen (just as Genie sees it) you could press Ctrl-F9 on that screen. The browser will ask you to download a file named json.txt which you could upload here -- I can use that json.txt file to re-play your screen on my machine and see all of the details on it. (Including the properties of all of the green-screen stuff that's sent from the server... it does not include your Genie customizations, however.)

[rmarsh]

Thanks Scott. By dynamic I do mean that the software populates the menu items. It is 11 output fields in a subfile window. Or at least it looks like a subfile window. It is third part software.

I did have the menu in question in a panel box but the manager would like to see a dropdown box. So the screen looks weird because I'm in the middle of changing things around. The menu output fields in Genie are D_2_7 through D_11_7 where the center number is incremented.

Infinium System Menu

InfinSysMenu.JPG (38.71 KiB) Viewed 2598 times

json (1).txt

json

(9.04 KiB) Downloaded 325 times

[Scott Klement]

How do you indicate (in green-screen) which menu option you've selected? I see there's a column of input fields next to the menu options. do you put a "1" next to the item you've selected? Or, how does that work?

[rmarsh]

F2, followed by 'S' then 'enter' activates the system menu and deactivates the others. I have that function in a radio button called "System Menu". It was bringing up a panel with the system menu on it. Now it just brings up the output fields D_2_7 - D_11_7.

F12 returns the menu you were on or a '1' or an 'X', on one of the system menu choices, followed by enter, will select a menu.
Then the system menu disappears and the main menu is active again.

[Scott Klement]

I'm not sure that I understand. Here's the screen you sent me (rendered in the Hybrid genie skin)

2-4-2015 11-47-49 AM.png (42.59 KiB) Viewed 2591 times

So if I'm on this screen, in order to select (for example) "Custom System #1", I have to hit F2, then S, then F12, then put an "1" somewhere?

I'm thinking that I'd just put a "1" in the field to the left of "Custom System #1" and press enter. Do I have to hit all those other keys first? Or is that just how you get to this screen? (I'm guessing those other keypresses are just how you get to this screen.)

Assuming i'm right, I'd do this:

• Go into Genie's designer.
• Select something (maybe the 'Systems Utilities Archives' at the top) as the identifier
• Drag a drop-down onto the screen where I want it. Change the id to "myDropdown".
• In the screen properties, put code in the "onload" event to load the text from the "D_x_7" fields into an array (where x is rows 2-11), hide the field, put the corresponding input field name into another array, and hide that. Then set the "choices" for my dropdown to be the array of text, and my "values" to be the array of corresponding input field names.
• In the dropdown properties, put code in the "onchange" event to get the value of the dropdown, use it to locate the appropriate input field, and put a "1" in that field. then press enter.

But, since I'm not 100% sure if that's how this menu works, this may be wrong.

But, the code to load the dropdown (that goes in the screen's onload event) would look something like this:

Code: Select all

var choices = ["-- Select --"];
var values = ["-"];
for (var row=2; row<=11; row++) {
  var elem = "D_" + row + "_7";
  var resp = "I_" + row + "_5";
  choices.push(get(elem));
  values.push(resp);
  hideElements(elem, resp);
}  
applyProperty("myDropdown", "choices", JSON.stringify(choices));
applyProperty("myDropdown", "choice values", JSON.stringify(values));

And the code to enter the response (that does in the dropdown's onchange event) would look like this:

Code: Select all

var resp = get(this);
if (resp != "-") {
  changeElementValue(resp, "1");
  pressKey("Enter");
}

Would that approach work here?

[rmarsh]

The menu in RED does not appear until after you press F2, type 'S' and press enter.

I still think it will work because the Profound screen reloads when you hit F2 and populates the system menu. I have to qualify most of my screen load manipulations because many elements are not available on every load. But that is not a problem I just put them in an if getObj("D_2_2" !== null) {...} and it works fine.

I'll give it a try. Thank you Scott.

2-4-2015 11-47-49 AM.png (47.36 KiB) Viewed 2590 times

[rmarsh]

The dropdown box is loading ok but the response is not working. It does not appear to be sending the response back to the IBM i.

The screen just reloads without any change.

[Scott Klement]

Oh, yeah... oops.. I applied the values to the wrong property.

Remove this line:

Code: Select all

applyProperty("myDropdown", "values", JSON.stringify(values));

And replace it with this line:

Code: Select all

applyProperty("myDropdown", "choice values", JSON.stringify(values));

[rmarsh]

That worked. Thank you again.

There is a lot of javascript going on there that I do not understand. I'm sure some of it is unique to working with ProfoundUI. What is the best resource for getting up to speed on this sort of thing or is it just something that comes with doing?