Skip to content

jQuery Upload File plugin provides Multiple file Uploads with progress bar.Works with any server-side platform (Google App Engine, PHP, Python, Ruby on Rails, Java, etc.) that supports standard HTML form file uploads.

License

Notifications You must be signed in to change notification settings

lanteng77/jquery-upload-file

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

27 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

#jQuery Upload File

##Overview jQuery Upload File plugin provides Multiple file Uploads with progress bar.Works with any server-side platform (Google App Engine, PHP, Python, Ruby on Rails, Java, etc.) that supports standard HTML form file uploads.


#Demo http://hayageek.com/docs/jquery-upload-file.php


#Supported Browsers IE 8.0,IE 9.0,IE 10.0,Firefox,Safari,Opera,Chrome

Drag drop is supported in IE10,Firefox,Safari,Opera,Chrome

##API

###uploadFile( options ) Creates Ajax form and uploads the files to server.

var uploadObj = $("#uploadDivId").uploadFile(options);

###startUpload() uploads all the selected files. This function is used when autoSubmit option is set to false.

uploadObj.startUpload();

###stopUpload() Aborts all the uploads

uploadObj.stopUpload();

#getResponses() Responses from the server are collected and returned.

uploadObj.getResponses()

##Options

###url Server URL which handles File uploads

###method Upload Form method type POST or GET. Default is POST

###enctype Upload Form enctype. Default is multipart/form-data.

###formData An object that should be send with file upload. data: { key1: 'value1', key2: 'value2' }

###dynamicFormData To provide form data dynamically

dynamicFormData: function()
{
    //var data ="XYZ=1&ABCD=2";
    var data ={"XYZ":1,"ABCD":2};
	return data;    	
}

###maxFileSize Allowed Maximum file Size in bytes.

###returnType Expected data type of the response. One of: null, 'xml', 'script', or 'json'. The dataType option provides a means for specifying how the server response should be handled. This maps directly to jQuery's dataType method. The following values are supported:

  • 'xml': server response is treated as XML and the 'success' callback method, if specified, will be passed the responseXML value
  • 'json': server response will be evaluted and passed to the 'success' callback, if specified
  • 'script': server response is evaluated in the global context

###allowedTypes List of comma separated file extensions: Default is "*". Example: "jpg,png,gif"

###fileName Name of the file input field. Default is file

###multiple If it is set to true, multiple file selection is allowed. Default isfalse

###dragDrop Drag drop is enabled if it is set to true

###autoSubmit
If it is set to true, files are uploaded automatically. Otherwise you need to call .startUpload function. Default istrue

###showCancel If it is set to false, Cancel button is hidden when autoSubmit is false. Default istrue

###showAbort
If it is set to false, Abort button is hidden when the upload is in progress. Default istrue

###showDone
If it is set to false, Done button is hidden when the upload is completed. Default istrue

###showDelete If it is set to true, Delete button is shown when the upload is completed. Default isfalse,You need to implement deleteCallback() function.

###showStatusAfterSuccess If it is set to false, status box will be hidden after the upload is done. Default istrue

###showError If it is set to false, Errors are not shown to user. Default istrue

###onSubmit callback back to be invoked before the file upload.

onSubmit:function(files)
{
	//files : List of files to be uploaded
	//return flase;   to stop upload
}

###onSuccess
callback to be invoked when the upload is successful.

onSuccess:function(files,data,xhr)
{
	//files: list of files
	//data: response from server
	//xhr : jquer xhr object
}

###afterUploadAll callback to be invoked when all the files are uploaded.

afterUploadAll:function(obj)
{
	//You can get data of the plugin using obj
}

###onError
callback to be invoked when the upload is failed.

onError: function(files,status,errMsg)
{
	//files: list of files
	//status: error status
	//errMsg: error message
}

###deleteCallback
callback to be invoked when the user clicks on Delete button.

deleteCallback: function(data,pd)
{
	for(var i=0;i<data.length;i++)
	{
	 	$.post("delete.php",{op:"delete",name:data[i]},
	    function(resp, textStatus, jqXHR)
	    {
			//Show Message	
			alert("File Deleted");	    
	    });
	 }		
	pd.statusbar.hide(); //You choice to hide/not.

}

About

jQuery Upload File plugin provides Multiple file Uploads with progress bar.Works with any server-side platform (Google App Engine, PHP, Python, Ruby on Rails, Java, etc.) that supports standard HTML form file uploads.

Resources

License

Stars

Watchers

Forks

Packages

No packages published