Skip to main content
S
Simon.Dau
Known Participant
December 13, 2009
Answered

need help with image upload and preview display

  • December 13, 2009
  • 1 reply
  • 1127 views

hi guys,

I'm trying to upload image and then display it as a preview, but when upload form submits to the same page image placeholder does not refreshes it's source and displays the same image as before.

Image 4.jpg already exists.

I upload it with nameConflict = "overwrite"

upload form points to the same page, therefore page reloads

In IE image placeholder does not display the new image, but shows the old one until I refresh the page with F5 and resend information, however if checked, image in the file is already different.

In Firefox, sometimes it works and image refreshes, sometimes not.

any help would be greatly appreciated!

cheers,

Simon

    This topic has been closed for replies.
    Correct answer Daverms

    Hi Daverms,

    With your code you suggest to not only upload the image but make a database entry too. However my intention is to firstly upload the file, and show a preview. Then if user is satisfied with what he sees, he presses "aprove" button and therefore makes a datase entry. Then the photo number will increase by one.

    Until user is not aproving the photo he can upload any image again and again, but the new image will be always given the same name (example 4.jpg) and overwriting the old one.

    I believe the problem persists because browsers are loading image with the same name from the cache, and not from the actual location. Therefore when I refresh the page it catches the correct image.

    If I follow your code, every time I upload the image, name of it is different, therefore browser cannot find it in the cache and is forced to load one from the server.

    I wonder is there any way to avoid this cache problem?

    cheers,

    Simon


    Hi Simon,

    In that case, you can follow this tutorial,

    http://www.communitymx.com/content/article.cfm?cid=71EDA

    HTH

    1 reply

    D
    Daverms
    Inspiring
    December 13, 2009

    Hi Simon,

    Can you please post your code here?.

    S
    Simon.DauAuthor
    Known Participant
    December 13, 2009

    page this code is in : upd_news.cfm

    <cfquery name="get_news_number" datasource="IGES">
    SELECT id
    FROM news
    ORDER BY id DESC
    </cfquery>
    <cfif structKeyExists(form, "uploadfile")>

    <cfset destination = expandPath("../images/news/")>
       
      <cffile action="upload" filefield="uploadfile" destination="#destination##get_news_number.id+1#.jpg" nameConflict="overwrite" result="upload" >
    </cfif>

    <form action="upd_news.cfm" method="post" enctype="multipart/form-data">
    Select a file: <input type="file" name="uploadfile">

    <input type="submit" value="Upload File">
    </form>


    <!---<cfif fileExists(expandPath("../images/news/#get_news_number.id#.jpg"))>--->
      <img name="dynamic_image" id="dynamic_image" src="../images/news/<cfoutput>#get_news_number.id+1#</cfoutput>.jpg" width="170" height="120" alt="" />
    <!---</cfif>--->

    as mentioned before after upload, which gives new images already existing name (example: 4.jpg) the new image does not appear in the "dynamic_image" placeholder. Instead i get the old one and have to refresh the page manually to display a new one.

    D
    Daverms
    Inspiring
    December 13, 2009

    Deleted... (Refer the latest post plz)...

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices