If you’ve been following this tutorial series you already know I’m a big fan of DMXzone´s Pure ASP Upload 3. It’s a great tool, but I wanted more. I soon learned that if I wanted to get the most out of Dreamweaver---and tools like Pure ASP Upload 3, I would have fine tune the code generated by Dreamweaver and PU3 to expand the possibilities. I quickly found that with a little hand coding, I could develop web applications as powerful, feature packed, and as versatile as anything I could code by hand. And I could do it in a lot less time.
Taking it to the Limit with Pure ASP upload 3.0: Multiple Images
In the first tutorial, "Taking it to the Limit with Pure ASP upload 3.0: Image Update Options" we learned to handle a single image in a form with text and image fields. In this tutorial we learn to delete multiple images—or delete a single image on a page with multiple images while setting the database field or fields to null by toggling the skip empty fields feature of Pure ASP Upload 3. In this section we will learn to handle multiple images—including multiple version of the same image, e.g. thumbs and large views on a page which updates images and text fields and on a page with images only while setting the database fields to null and either skipping the empty field, or updating it when a new image is uploaded.
The methods presented in this tutorial, will help you take your web applications to the limit in power, performance, and efficiency.
Although this tutorial is part of a series, it stands on its own, though you may have a bit more trouble keeping up than you would if you read the first of the series. It assumes you know how to create a record set to populate your form with existing data, know how to apply the Dreamweaver Update Server Behaviour, and have some familiarity with the file scripting object. If you have never configured a connection string, created a record set, populated a form with data, applied an insert or update behaviour and successfully run the page then this tutorial is not for you. Of course you also need to know how to apply the Pure ASP Upload behaviour. The first thing we do is set up our form. So let's get started!
Tip:The File Scripting Object--often abbreviated fso--allows us to access the server file system.
Since we're dealing with images it seems a good idea to display the existing image on the update page so the user can make a decision as to whether or not to replace or remove the image. To do this we will create a conditional region. The conditional region will display two elements: If the database image field has a value other than null, the first will be image itself. The second element is the Delete Image? check box. The conditional region will do two things. If there is an image, it will be displayed along with the Delete Image? checkbox. If there is no image, the message No existing image will be displayed. If the record set image field has an image specified and no image is found, then the dreaded red X will appear. On the front of end of the application, I prefer to use the file scripting object to determine if the specified image exists, before displaying it, thus avoiding the red X when the image cannot be found. You will be learning to use the file scripting object into today's tutorial.
If you read the first tutorial, this will be familiar. We're going to display the existing images and a form check box to replace or remove the image in a conditional region. The conditional region will do two things. If there is an image, it will be displayed along with the form checkbox: Delete Image? If there is no image, the message No existing image will be displayed. If the record set image field has an image specified and no image is found, a red X will appear to alert the user of the missing image. (I prefer to use the file scripting object for displaying images on the site front end. See my tutorial, "Taking it to the Limit with Pure ASP upload 3.0: Image Update Options" for this technique.) This time, however, we are going to name our form fields in a numerical sequence: e.g. Delete_Image1, Delete_Image2, Delete_Image3. The page also has fields for a page heading, two page subheadings, and three paragraphs of text.
<% If (rs_links.Fields.Item("P_Image").Value)<> "" Then%>
<img src="../site_images/<%=(rs_page.Fields.Item("P_Image").Value)%>" alt="Existing Image" /></td>
<td colspan="2">Delete Image?</td>
<td><input name="Delete_Image1" type="checkbox" id="Delete_Image1" value="Y" />
<% Else%>No Image Available
<% End If %>
Form code block
Now that you have created your three conditional regions, your page should look like this when there are no images assigned.
Page without images 1
If you have already assigned images it should look like this.
Page with images 1