HostMySite.Com is sponsoring this tutorial, please visit their site today!

Random Image by: Chris

[Download in PDF Format] [Download in FlashPaper Format]

First off create a database called Images and 3 fields called

image_id (Autonumber)
links (text)
picture (text)

Then do the following:

Default.cfm
<!--- get the images and stroe into memory --->
<cfquery name="qGetImages" datasource="Image">
    SELECT picture, descrip, link
    FROM images
    ORDER BY image_id
</cfquery>

<!--- catch queries with no values --->
<cfif qGetImages.RecordCount>
    <!--- pick a random image from the query --->
    <cfset current_image = RandRange(1, qGetImages.RecordCount)>
    <cfoutput>
    <table>
      <tr>
         <td><a href="#qGetImages.link[current_image]#" target="_self"><img src="http://localhost/Images/#qGetImages.picture[current_image]#" border="0" alt=" Image "></a></td>
      </tr>
      <tr>
         <td><a href="#qGetImages.link[current_image]#">#qGetImages.descrip[current_image]#</a></td>
      </tr>
    </table>
    </cfoutput>
<cfelse>
    <!--- no images found, display the default image instead --->
    <img src="default.gif" border="0" alt=" Default Image ">
</cfif>

delete.cfm
<cfquery name="qDelete" datasource="Image">
    DELETE picture, descrip, link
    FROM images
    WHERE image_id = #id#
</cfquery>

form.cfm
<form action="upload_action.cfm" method="POST" enctype="multipart/form-data" name="contact" onsubmit='return checkForm();'>
<div>
 <TABLE BORDER="0" bgcolor="#ffffff">
   <TR>
     <TD>Browse for Image File:</TD>
     <TD><input name="picture" size="53" type="file" value=""></TD>
   <tr>
     <td>Type in Description:</TD>
     <TD><textarea name="descrip" rows="7" cols="50"></textarea></TD>
   <TR>
     <TD>Type in hyperlink:</TD>
     <TD><input type="text" name="link" size="66"></TD>
   </TR>
   <TR>
     <TD COLSPAN="2"><input type="Submit" value="Insert"></td>
   </tr>
  </TABLE>
</div>
</form>
<BR><BR>
<cfinclude template ="list.cfm">

list.cfm
<cfquery name="qGetImages" datasource="Image">
    SELECT picture, descrip, link, image_id
    FROM images
    ORDER BY image_id
</cfquery>

<!--- Now display the records to the user --->
<HR>
<cfoutput query="qGetImages">
<table>
    <tr><td><img src="http://localhost/Images/#qGetImages.picture#" border="0" alt=" Image "></td></tr>
    <tr><td>#picture#</td></tr>
    <tr><td>#descrip#</td></tr>
    <tr><td>>#link#</td></tr>
</table>

<a href="delete.cfm?id=#image_id#" onClick="return confirm('Are You Sure You Want To Delete This Record?');">DELETE</a>

<HR>
</cfoutput>

upload_action.cfm
<cfif picture NEQ ''>
    <CFFILE ACTION="upload"
                FILEFIELD="picture"
                DESTINATION="E:\webserver\Images\"
                NAMECONFLICT="MAKEUNIQUE">
    <cfset upload= #file.serverfile#>
    <cfoutput>
        #serverFile# successfully added. Size of the uploaded file:
        #Numberformat(Evaluate(File.FileSize/1024))# KB.</cfoutput>
</cfif>
<br>

<cfquery name="InsertDetails" datasource="Image">
    INSERT INTO Images (picture, descrip, link)
    VALUES ('#listLast(file.serverFile, '\')#', '#form.descrip#', '#form.link#')
</cfquery>

HostMySite.Com is sponsoring this tutorial, please visit their site today!

Please rate this tutorial:

Post a new comment on this tutorial
post a new comment on this particular tutorial
Your Name:
Your Email:
Comment Title:
Comments:
Key Phrase: