• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

How would you generate a cfimage from an ajax call?

Explorer ,
Jan 29, 2014 Jan 29, 2014

Copy link to clipboard

Copied

I have a bunch of form fields that are all bound to a single drop down selection. When an option is selected I need to fill in a bunch of form fields with data. The last part is that I need to retrieve an image that is stored in sql server an image field and output the image on the page. All of the form fields are populating properly based on the cfc I am using. I can generate the image with a straight query output but cannot figure out how to trigger the generation of the image when the cfselect option changes.

Any thoughts?

TOPICS
Advanced techniques

Views

338

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 01, 2014 Feb 01, 2014

Copy link to clipboard

Copied

LATEST

siriiven wrote:

How would you generate a cfimage from an ajax call?

Using cfdiv, for example. To run a proof of concept, follow these steps:

1) Create a test directory under the web-root for this. Obtain two distinct image files, rename them, say, testImage1.png and testImage2.png, and move them to the test directory.

2) Create the following 2 CFM files in the test directory

formPage.cfm


<cfform>

<cfselect name="mySelection">

    <option value="no_img">Option 0</option>

    <option value="img1">Option 1</option>

    <option value="img2">Option 2</option>

</cfselect>

</cfform>

<h3> Div to contain the image </h3>

<cfdiv bind="url:imageURL.cfm?someVar={mySelection}" ID="theDiv" style="height:400"/>

imageURL.cfm

<h3>Echoing image</h3>

<!--- Code to simulate obtaining the path of an image from the database, based on the input URL variable --->

<cfif isdefined("url.someVar") and url.someVar eq "img1">

        <!--- Query to obtain relative path of image 1 --->

        <img src="testImage1.png">

<cfelseif isdefined("url.someVar") and url.someVar eq "img2">

        <!--- Query to obtain relative path of image 2 --->

        <img src="testImage2.png">  

<cfelse>

No image!

</cfif>

3) When you run the form page, the div will display an image that corresponds to the option selected in the form.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources
Documentation