Adobe LiveCycle (Archived)

fcbg1234 · 2/11/15

I'm new to Live Cycle Designer and trying to create a form where you can select a name of an image from a drop down list and that image will appear on the page to be printed. The images would vary in size if that matters.

I copy and pasted code using Microsoft Front Page and it works but not sure how to convert it to a .pdf. Maybe it isn't even possible as I'm wondering where the images would reside??

Here's my Front Page code:

<html>
<head>
<script type='text/javascript'>
window.onload=function(){
function setImage() {
    var img = document.getElementById("image");
    img.src = this.value;
    return false;
}
document.getElementById("ImageList").onchange = setImage;
}

</script>

</head>
<body>

<select id="ImageList">
     <option value="images/transimage.gif">Select Image</option>
    <option value="images/image1.gif">
Image 1</option>
    <option value="images/image2.jpg">
Image 2</option>
</select>

<p><img id="image" src="images/transimage.gif" /></p>

</body>

</html>

Thanks for any help.

TB17 · 2/11/15

If you made sure the export values are set under the Binding tab then it should work. Are you saving the form as a "Dynamic" PDF vs static? If not, try saving as a dynamic form.

View solution in original post

TB17 · 2/11/15

NOTE: Below are two simple options.

Assign an exported value to the selectable items in the drop-down (i.e. 1,2,3). You would do this on the Binding tab (Specify Item Values)

OPTION 1:

Use the following script on the "Exit" event of the drop-down

if (this.rawValue == "1"){//a "space" character to represent a blank option in the drop-down

Image1.presence = "hidden"

Image2.presence = "hidden"

}

if (this.rawValue == "2"){

Image1.presence = "visible"

Image2.presence = "hidden"

}

if (this.rawValue == "3"){

Image1.presence = "hidden"

Image2.presence = "visible"

}

OPTION 2:

switch (this.rawValue)

{

case "1"://a "space" character to represent a blank option in the drop-down

Image1.presence = "hidden"

Image2.presence = "hidden"

break;

case "2":

Image1.presence = "visible"

Image2.presence = "hidden"

break;

case "3":

Image2.presence = "visible"

Image1.presence = "hidden"

break;

}

Hope this helps!

TB17 · 2/11/15

P.S. In the solution above, the images reside in the form - you are basically controlling the "presence"...either "hidden" or "visible". This is with the presumption that only one image is visible at a time. You will have to determine where the images are placed on the form (i.e. stacked on top of one another, within a subform, etc).

fcbg1234 · 2/11/15

I can't seem to get the images to display after selecting an image from the drop down nothing appears. I selected javascript and added your suggestion to the exit on the drop down list. I placed my images using a the Image command not the Image Field command and then hide the two images. I used the Binding tab and gave them a value of 1 & 2 but nothing appears when I select image 1 or 2 from the drop down.

This might be more then I want to get into but let's say I have 20 images I want available. First I would have to stack all the images on the page and hide them. Then, I would have to write the code to be that if image 1 is visible then images 2-20 would be hidden. So it would look something like this??

if (this.rawValue =="1"){//a "space" character to represent a blank option in the drop-down

Image1.presence = "visible"

Image2.presence = "hidden"

Image3.presence = "hidden"

Image5.presence = "hidden"

Image6.presence = "hidden"

Image7.presence = "hidden"

Image8.presence = "hidden"

Image9.presence = "hidden"

Image10.presence = "hidden"

Image11.presence = "hidden"

Image12.presence = "hidden"

Image13.presence = "hidden"

Image14.presence = "hidden"

Image15.presence = "hidden"

Image16.presence = "hidden"

Image17.presence = "hidden"

Image18.presence = "hidden"

Image19.presence = "hidden"

Image20.presence = "hidden"

}

if (this.rawValue =="2")

Image2.presence = "visible"

Image1.presence = "hidden"
Image3.presence = "hidden"

Image5.presence = "hidden"

Image6.presence = "hidden"

Image7.presence = "hidden"

Image8.presence = "hidden"

Image9.presence = "hidden"

Image10.presence = "hidden"

Image11.presence = "hidden"

Image12.presence = "hidden"

Image13.presence = "hidden"

Image14.presence = "hidden"

Image15.presence = "hidden"

Image16.presence = "hidden"

Image17.presence = "hidden"

Image18.presence = "hidden"

Image19.presence = "hidden"

Image20.presence = "hidden"

}

Is there any way to pull the images from a file or do they need to be stacked and hidden on the page?

fcbg1234 · 2/11/15

I thought this might work but still no image is displayed. No errors just no image. As before I just chose Insert, Image and selected the image I wanted and hide it and did that with three images. What's the difference between Image and Image Field? Would that have anything to do with it?? It seems like I'm just about there, I generally get all kinds of errors trying to do this stuff. Thanks again!

form1.#subform[0].DropDownList1::exit - (JavaScript, client)

if (this.rawValue == "1"){

Image1.presence ="visible"

Image2.presence = "hidden"

Image3.presence = "hidden"

}

if (this.rawValue == "2"){

Image1.presence = "hidden"

Image2.presence = "visible"

Image3.presence = "hidden"

}

if (this.rawValue == "3"){

Image1.presence = "hidden"

Image2.presence = "hidden"

Image3.presence = "visible"

}

TB17 · 2/11/15

If you made sure the export values are set under the Binding tab then it should work. Are you saving the form as a "Dynamic" PDF vs static? If not, try saving as a dynamic form.

TB17 · 2/11/15

Re: the difference between the Image and Image Field objects... The "Image" object is typically used during design (i.e. the image is added to the form by the form designer - just like what you are doing by pre-placing the image son the form ). If you want the image to be available for future edits (especially when editing on a different machine) then you'd want to select the "Embed Image Date" option. Doing this will increase the overall file size, but it help ensure the graphic will be there if the form is opened for editing and later re-saved.

On the other hand, an "Image Field" is just like any other field in which you expect the "user" to enter data during run-time. In this case, the user would be uploading an image file vs text. A perfect example of this would be a form asking the user to upload a photo as part of an application. This field will initially appear blank until the user clicks on it, at which point a "Select Image File" prompt will pop up.. The uploaded image can also can be "embedded" into the form like mentioned above.

TB17 · 2/11/15

Lastly, you might already know this, but also make sure you are referencing the correct paths in your scripts. For example, if your images are placed in another/separate subform called Photos, then the above path is incorrect.

Instead, it would be something like:

if (this.rawValue == "1"){

Photos.Image1.presence ="visible"

Photos.Image2.presence = "hidden"

Photos.Image3.presence = "hidden"

}

if (this.rawValue == "2"){

Photos.Image1.presence = "hidden"

Photos.Image2.presence = "visible"

Photos.Image3.presence = "hidden"

}

So, the design/structure of your form goes hand-in-hand with the coding/scripting of your form.

fcbg1234 · 2/12/15

Saving the form as Dynamic XML made things work.

Thanks for the information.

Adobe LiveCycle (Archived)

Display image based on drop down selection.

Learn

Documentation

Community

Support

Resources

Adobe account

Adobe