Expand my Community achievements bar.

Learn about Edge Delivery Services in upcoming GEM session

How can I generate different images for each choice made in a drop down?

Avatar

Level 1


Hello everyone,

     I am new to livecycle and scripting and I have a question. I have figured out how to use a switch statement to generate choices in a drop drown from the choice in another fairly quickly. However, I've tried searching and bought the book by J.P Terry to self teach. I may have missed it, but I want to be able to click on one of the choices that have been generated and an image of it displayed below the drop down box. Here is an example of what I'm talking about:

For Example: DropDownList1 is scripted so that if I choose either value 0 or 1, the three items are then listed in DropDownList2. I want to be able a to choose any of the six items, when the choice is available in DropDownList2, and an image for each item will be displayed when I click on it. I believe this is possible but I am an amateur and I need the guidance of an experienced user. Thank you for your help.

DropDownList2.clearItems();

switch(this.rawValue){

    case "0":

        DropDownList2.addItem("Item One"

        DropDownList2.addItem("Item Two");

        DropDownList2.addItem("Item Three");

        break;

    case "1":

        DropDownList2.addItem("Item Four"

        DropDownList2.addItem("Item Five");

        DropDownList2.addItem("Item Six");

        break;

}























































































































































































3 Replies

Avatar

Level 2

Hi,

Assuming the following:

  • Images are of the same size and
  • they are all staked on top of each others
  • they are all hidden, then


You can use the following code, switch statement, in your "change" event in the DropDownList2 as following:

switch(xfa.event.newText){

    case "Item One":

        image01.presence = "visible";

        image02.presence = "hidden";

        image03.presence = "hidden";

                break;

    case "Item Two":

        image01.presence = "hidden";

        image02.presence = "visible";

        image03.presence = "hidden";

                break;

    case "Item Three":      

        image01.presence = "hidden";

        image02.presence = "hidden";

        image03.presence = "visible";

                break;

}

NOTE: Please double check syntax and typos...

Avatar

Level 1


It almost works. Maybe I am doing it wrong or I didn't explain it well enough. I want to get this right because in all reality I have 20 cases and each will have up to 20 items that will populate in DropDownList2. These means there will be 400 images so I want get it right. I guess the best anaolgy is I will have a drop down  list of a bunch of car makes (I.E. Ford, Chevrolet, and Honda) and when I chose one of the makes,  the models populate with the switch statement in that list. So If I click on Ford in List 1, I will have Mustang, Probe, Ranger, etc. become options in List 2. Now when I click on Mustang, I want the Image to display. If I click on Ranger, The mustang will be hidden and the Ranger will be in it's place. I think you are right and I may be messing it up but I did a sample of three and when I click the first option, the image displays perfectly, but nothing else comes up when I ttry to select a different one. I hope this isn't too wordy and is understandable. I really do appreciate the help!

Avatar

Level 2

Ok...I got it.

This is how the objects are organized :

Picture1.png

and here is the objects hierarchy:

Picture2.png

Here is a sample that works (with the associated events):

@ "initialize" event on the drop down list:

try{

  imgIconA.presence = "hidden";

  imgIconB.presence = "hidden";

  imgIconC.presence = "hidden";

}

catch(err){

  xfa.host.messageBox(err.message);

}

@ "change" event on the drop down list

try{

  switch (xfa.event.newText){

  case "A": {

  imgIconA.presence = "visible";

  imgIconB.presence = "hidden";

  imgIconC.presence = "hidden";

  break;

  }

  case "B": {

  imgIconA.presence = "hidden";

  imgIconB.presence = "visible";

  imgIconC.presence = "hidden";

  break;

  }

  case "C": {

  imgIconA.presence = "hidden";

  imgIconB.presence = "hidden";

  imgIconC.presence = "visible";

  break;

  }

  }

}

catch(err){

  xfa.host.messageBox(err.message);

}