Solved

Upload file

Posted on 2002-06-09
8
264 Views
Last Modified: 2013-12-24
I would like to add an upload an image feature to the existing form:

Name:
Email:
Photo:

I know how to write the form and database for this and process the form for name and email ... but I'm not sure how to add the upload an image.  I've been looking at my CFML book and it appears that this would have to be done using a seperate form.  But is there a way to do it all on one form ... processing all fields, including the file upload all at once?

Thanks,
Ansia
0
Comment
Question by:Ansia
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 4
8 Comments
 
LVL 1

Expert Comment

by:ndintenfass
ID: 7065478
You can do this all on one form.

You will most probably just store the name of the image file in your database.  Alternatively, you may want to store the "ContentType" and "ContentSubType" fields.

One thing to always remember is that when you are uploading files in a form you MUST have the ENCTYPE="multipart/form-data" attribute in the FORM tag.

Here is some code that should get you started:


----- THE FORM -------

<form action="YourActionPage" method="post" enctype="multipart/form-data">
Name:<br>
<input type="text" name="name">
<br><br>
Email:<br>
<input type="text" name="email">
<br><br>
Photo<br>
<input type="file" name="photo">
<br><br>
<input type="submit" value="Go!">


----- THE CODE DEALING WITH THE FILE ON FORM ACTION -------
[[NOTE: THIS CODE ASSUMES THE FILE IS BEING UPLOADED, but you can check to see if it has been by seeing if the form field containing the file is an empty string -- if it's an emptry string, there is no file being uploaded]]


<!--- I like to build a struct with the file info --->
<cfset FileInfo = StructNew()>
<!--- this is the tag that puts the uploaded file on the server --->
<!--- you put in an absolute path -- in this case, it is just putting it into the directory of the calling page --->
<cfset directoryToStorePhotos = expandpath("./")>
<cffile action="UPLOAD" filefield="photo" destination="#directoryToStorePhotos#" nameconflict="MAKEUNIQUE">
<!--- if the file was saved, build a structure containing information about it --->
<cfif File.FileWasSaved>
     <cfset FileInfo.Path = directoryToStorePhotos>
     <cfset FileInfo.Name = File.ServerFile>
     <cfset FileInfo.Label = File.ClientFile>
     <cfset FileInfo.Type = File.ContentType>
     <cfset FileInfo.sub_type = File.ContentSubType>
</cfif>          
<!--- make sure the file is a web image, if it is not, delete it and set an error --->    
<cfif File.ContentType is not "image" or (File.ContentSubType is not "gif" AND File.ContentSubType is not "jpeg" and File.ContentSubType is not "pjpeg")>
     <!--- you will have your own way to deal with an error condition here, probably --->
     <cfset request.error = 1>
     <cffile action="Delete" file="#expandpath("images/pieces/#FileInfo.Name#")#">
     <cfset message="You can only upload gifs or jpegs">
</cfif>          


AT THIS POINT YOU NOW HAVE THE IMAGE UPLOADED TO YOUR SERVER AND HAVE THE NAME AND PATH OF THAT FILE IN THE FileInfo struct -- you can use this to insert into your database.  Then, you can dynamically populate the IMG tag when you go to display the image.  Also, if you are also allowing the end-user to edit the entry, you will need to detect if they are uploading a new photo and delete the old photo (or, at least, that's a common way to deal with it).

Make sense?
0
 

Author Comment

by:Ansia
ID: 7066024
yes .. it does make sense ... now to give it a try.

Question: In my database ... how do I name the field for the image? #imagename# ?

On the page where I want to display the info, it should then display where I have the field name #imagename# ? Am I to make a seperate directory in my remote folder for the images?  I'm trying to figure out how to point to the images so it will display along with the rest of the info.

Ansia
0
 
LVL 1

Expert Comment

by:ndintenfass
ID: 7066027
You name the field whatever you like.  "imagename" would do just fine.

You can create the directory structure however you like, but it would probably be wise to create a separate sub-directory that holds the uploaded photos.

For instance, if you created a directory called "photos" you would then set the line in the code I showed above to:

<cfset directoryToStorePhotos = expandPath("photos/")>

(assuming the page with the form is in the root above the directory photos)

Then, on the page where you show the image you could do something like:

<img src="photos/#imagename#">

Does that help?
0
Free NetCrunch network monitor licenses!

Only on Experts-Exchange: Sign-up for a free-trial and we'll send you your permanent license!

Here is what you get: 30 Nodes | Unlimited Sensors | No Time Restrictions | Absolutely FREE!

Act now. This offer ends July 14, 2017.

 

Author Comment

by:Ansia
ID: 7080452
yes, very much helps.
but I'm also wondering: how to I get a user to upload the image file to my remote directory?

I want the image to go to "http://www.mydomain.com/uploads"

I've hit a wall here.  I think it's because you need a login/password to ftp files to my remote directory.

0
 
LVL 1

Expert Comment

by:ndintenfass
ID: 7080459
On the server you will use the CFFILE tag to capture the uploaded file and write it to disk.

Assuming the file that contains the CFFILE tag resides in the web root at a URL something like:

http://www.yourdomain.com/upload.cfm

On the upload.cfm page you can use the expandPath() function to put the file into the "uploads" directory, which appears to sit under the web root.  It might look something like this:

<cfset directoryToStorePhotos = expandpath("uploads/")>

<cffile action="UPLOAD" filefield="photo" destination="#directoryToStorePhotos#" nameconflict="MAKEUNIQUE">

Make sense?
0
 

Author Comment

by:Ansia
ID: 7080470
I'm starting to get it ...

In my access database, I have this field named "aphoto" and the field type set as "OLE Object".  Is this correct?

Here's what I have so far with the upload.cfm page:

<CFIF IsDefined("form.aDescription")>
  <CFINSERT DATASOURCE="aartra11.data"
  TABLENAME="available" FORMFIELDS="aDate,aDescription,aPriceTrade,aContact,aPhone,aEmail,aphoto">
</CFIF>

<body>
<CFFILE
DESTINATION="http://www.mydomain.com/AHTBC/uploads/"
ACTION="UPLOAD"
NAMECONFLICT="OVERWRITE"
FILEFIELD="aphoto">
<CFOUTPUT>
File upload was successful
</CFOUTPUT>
</body>

can you help me write this page correctly?
this is a new thing for me and I really appreciate the help!

Thanks :)
0
 
LVL 1

Accepted Solution

by:
ndintenfass earned 200 total points
ID: 7080484
Actually, no.  You are not going to store the image in the database, only the name of the image (and path, if you choose).  Change the field in your database to a text field, and use it to just store the name of the file.

Check out the code I originally posted.  In that example, the form contains a file field called "photo".  Also, make sure to put the ENCTYPE attribute in your FORM tag.

You will not be able to use CFINSERT to put the file or the name of the file into your database.

You might do something like:

<cfif isDefined("form.aDescription")>
     <!--- I like to build a struct with the file info --->
     <cfset FileInfo = StructNew()>
     <!--- this is the tag that puts the uploaded file on the server --->
     <!--- you put in an absolute path -- in this case, it is just putting it into the directory of the calling
     page --->
     <cfset directoryToStorePhotos = expandpath("uploads/")>
     <cffile action="UPLOAD" filefield="aPhoto" destination="#directoryToStorePhotos#" nameconflict="OVERWRITE">
     <!--- if the file was saved, build a structure containing information about it --->
     <cfif File.FileWasSaved>
         <cfset FileInfo.Path = directoryToStorePhotos>
         <cfset FileInfo.Name = File.ServerFile>
         <cfset FileInfo.Label = File.ClientFile>
         <cfset FileInfo.Type = File.ContentType>
         <cfset FileInfo.sub_type = File.ContentSubType>
     </cfif>          
     <!--- make sure the file is a web image, if it is not, delete it and set an error --->    
     <cfif File.ContentType is not "image" or (File.ContentSubType is not "gif" AND File.ContentSubType is not "jpeg" and File.ContentSubType is not "pjpeg")>
         <!--- you will have your own way to deal with an error condition here, probably --->
         <cfset request.error = 1>
         <cffile action="Delete" file="#expandpath("images/pieces/#FileInfo.Name#")#">
         <cfset message="You can only upload gifs or jpegs">
     </cfif>          
     <!--- now insert the information into the database --->
     <cfquery name="insert" datasource="aartra11.data">
          INSERT INTO available
          (
               aDate,aDescription,aPriceTrade,aContact,aPhone,aEmail,aphoto
          )
          VALUES
          (
               #createODBCDateTime(form.aDate)#,'#form.aDescription#','#form.aPriceTrade#','#form.aContact#','#form.aPhone#','#form.aEmail#','#fileInfo.name#')
          )
         
     </cfquery>
</cfif>

If you don't want to use a CFQUERY and like to continue to use CFINSERT, you may be able to do this in place of the CFQUERY tag above:

<CFSET FORM.aPhoto = fileInfo.name>

 <CFINSERT DATASOURCE="aartra11.data"
 TABLENAME="available" FORMFIELDS="aDate,aDescription,aPriceTrade,aContact,aPhone,aEmail,aphoto">
0
 

Author Comment

by:Ansia
ID: 7080598
Okay ... here goes!

If I have any problems, I'll post it in another question.

THANK YOU SO MUCH for your help!!! :)

Ansia
0

Featured Post

The Ultimate Checklist to Optimize Your Website

Websites are getting bigger and complicated by the day. Video, images, custom fonts are all great for showcasing your product/service. But the price to pay in terms of reduced page load times and ultimately, decreased sales, can lead to some difficult decisions about what to cut.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This is a guide to setting up a new WHM/cPanel Server to be used for web hosting accounts. It is intended for web hosting company administrators and dedicated server owners. For under $99 per month (considering normal rate of Big Data Cetnters like …
When it comes to security, close monitoring is a must. According to WhiteHat Security annual report, a substantial number of all web applications are vulnerable always. Monitis offers a new product - fully-featured Website security monitoring and pr…
Monitoring a network: why having a policy is the best policy? Michael Kulchisky, MCSE, MCSA, MCP, VTSP, VSP, CCSP outlines the enormous benefits of having a policy-based approach when monitoring medium and large networks. Software utilized in this v…
Michael from AdRem Software outlines event notifications and Automatic Corrective Actions in network monitoring. Automatic Corrective Actions are scripts, which can automatically run upon discovery of a certain undesirable condition in your network.…

728 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question