46 Part I: Core Ideas
as you don’t want a scriptable conduit to your local disk drive! Yet the question then begs,
how do you then upload files with JavaScript? Traditionally without JavaScript, you create a
form, set it to post to an upload script, and make sure to set its encoding type properly. It is
also possible to specify a target for the form post. A common use is to set this to an iframe
on the page in order to display a confirmation message.<form " action="fileupload1.php" method="POST" enctype="multipart/form-data
target="uploadresult">
<label> File: <input name="uploadedfile" type="file" /></label>
<input type="submit" value="Upload" />
</form>
<iframe name="uploadresult" width="80%" frameborder="1" height="20%"></iframe>In the case of scripting a file upload, the technique is pretty much the same, but the
iframe remains hidden, it consumes any response that comes back in it, and progress bars
might be added to the page to dress up the process since the upload activity may take a
while. To illustrate this, we present a simple JavaScript-improved file upload example that
allows you to attach up to 10 small (< 100K) image files to be uploaded to the server. The
example can be found at http://ajaxref.com/ch2/iframeupload.html, and a screen capture
showing the file upload widget and result is shown in Figure 2-8.FIGURE 2-8 Iframe upload in action