uploadify

piaoling  2011-04-30 00:24:49

Documentation

Uploadify was created to be an easy-to-implement solution for multiple file uploads.  As a jQuery plugin, the Uploadify implementation is simple and highly-customizable.

While it may require a foundational knowledge of jQuery to successfully implement, this documentation should provide a comprehensive enough reference for those who are having trouble.  If you are running into issues that this documentation can't help solve, there is an active community of Uploadify users that can be accessed through the forums.  In addition, we've provided a list of FAQs that may also aid in troubleshooting your Uploadify instance.

Implementation

Before implementing an instance of Uploadify, make sure the minimum requirements are met:

  • jQuery 1.4.x or greater
  • swfObject 2.2 or greater
  • Flash Player 9.0.24 or greater

Download the latest zip package.  Extract the following files to a folder named "uploadify" in the root of your website.

  • cancel.png
  • jquery.uploadify.v2.1.4.min.js
  • jquery-1.4.2.min.js
  • swfobject.js
  • uploadify.css
  • uploadify.php
  • uploadify.swf

Save a new page to the root directory of your website and paste the following code into the section:

Head Section
  1. <link href="/uploadify/uploadify.css" type="text/css" rel="stylesheet" />
  2. <script type="text/javascript" src="/uploadify/jquery-1.4.2.min.js"></script>
  3. <script type="text/javascript" src="/uploadify/swfobject.js"></script>
  4. <script type="text/javascript" src="/uploadify/jquery.uploadify.v2.1.4.min.js"></script>
  5. <script type="text/javascript">
  6. $(document).ready(function() {
  7.   $('#file_upload').uploadify({
  8.     'uploader'  : '/uploadify/uploadify.swf',
  9.     'script'    : '/uploadify/uploadify.php',
  10.     'cancelImg' : '/uploadify/cancel.png',
  11.     'folder'    : '/uploads',
  12.     'auto'      : true
  13.   });
  14. });
  15. </script>

*Make sure the folder you are uploading to exists and has write permissions.

In the body section of the page, add the following code:

Body Section
  1. <input id="file_upload" name="file_upload" type="file" />

When the page is loaded, the file input will automatically be replaced with the Uploadify file uploader.

Notes

  • We highly recommend using paths that are relative to the root (AKA begin with a /).  If this isn't possible, Uploadify does play nice with links that are relative to the page.
  • Every element that Uploadify is applied to MUST have a unique ID attribute.  You can reference elements via class, but each element must have a unique ID.

For a more customized uploader, use the options below.

 

Options

(boolean)

auto

Automatically upload files as they are added to the queue.

(string)

buttonImg

The path to an image you would like to use as the browse button.

(string)

buttonText

The text that appears on the default button.

(string)

cancelImg

The path to an image you would like to use as the cancel button.

(string)

checkScript

The path to the back-end script that checks for pre-existing files on the server.

(string)

displayData

The type of data to display in the queue item during an upload.

(string)

expressInstall

The path to the expressInstall.swf file.

(string)

fileDataName

The name of your files array in the back-end script.

(string)

fileDesc

The text that will appear in the file type drop down at the bottom of the browse dialog box.

(string)

fileExt

A list of file extensions that are allowed for upload.

(string)

folder

The path to the folder where you want to save the files.

(integer)

height

The height of the browse button.

(boolean)

hideButton

Enable to hide the flash button so you can style the underlying DIV element.

(string)

method

The form method for sending scriptData to the back-end script.

(boolean)

multi

Allow multiple file uploads.

(string)

queueID

The ID of the element on the page you want to use as your file queue.

(integer)

queueSizeLimit

The limit of files that can be in the queue at one time.

(boolean)

removeCompleted

Enable automatic removal of the queue item for completed uploads.

(boolean)

rollover

Enable to activate rollover states for your browse button.

(string)

script

The path to the back-end script that will process the file uploads.

(string)

scriptAccess

The access mode for scripts in the main swf file.

(JSON object with mixed types)

scriptData

An object containing name/value pairs with additional information that should be sent to the back-end script when processing a file upload.

(integer)

simUploadLimit

The limit of uploads that can run simultaneously per Uploadify instance.

(integer)

sizeLimit

The size limit in bytes for each file upload.

(string)

uploader

The path to the uploadify.swf file.

(integer)

width

The width of the browse button.

(string)

wmode

The wmode of the flash file.

Events

(function)

onAllComplete

Triggers once when all files in the queue have finished uploading.

(function)

onCancel

Triggers once for each file that is removed from the queue.

(function)

onCheck

Triggers at the beginning of an upload if a file with the same name is detected.

(function)

onClearQueue

Triggers once when the uploadifyClearQueue() method is called.

(function)

onComplete

Triggers once for each file upload that is completed.

(function)

onError

Triggers when an error is returned for a file upload.

(function)

onInit

Triggers when the Uploadify instance is loaded.

(function)

onOpen

Triggers once when a file in the queue begins uploading.

(function)

onProgress

Triggers each time the progress of a file upload changes.

(function)

onQueueFull

Triggers when the number of files in the queue matches the queueSizeLimit.

(function)

onSelect

Triggers once for each file that is added to the queue.

(function)

onSelectOnce

Triggers once each time a file or group of files is added to the queue.

(function)

onSWFReady

Triggers when the flash file is done loading.

Methods

.uploadify()

Create an instance of the Uploadify uploader.

.uploadifyCancel()

Remove a file from the queue. If the upload is in progress, this will cancel the upload and remove the file from the queue.

.uploadifyClearQueue()

Remove all files from the file upload queue and cancel any file uploads that are in progress.

.uploadifySettings()

Change the options for an Uploadify instance.

.uploadifyUpload()

Trigger the file upload.

coming from:http://www.uploadify.com/documentation/

类别 :  jQuery(9)  |  浏览(10422)  |  评论(0)
发表评论(评论将通过邮件发给作者):

Email: