Suppose that users open a page where Image Uploader is deployed and select files for the upload. They may leave this page for some reasons and reopen it after some time. And it would be nice to restore the upload list in this situation to prevent users from selecting the same files again. Therefore, Image Uploader provides a possibility to save the upload list on the client side and restore it at any moment. This functionality is implemented via the SaveUploadList(), LoadUploadList(), and ResetUploadList() methods.

  • SaveUploadList() saves the upload list with the specified ID;
  • LoadUploadList() loads the upload list with the specified ID;
  • ResetUploadList() resets the upload list with the specified ID.

All these methods use the ID parameter which should be a unique integer value corresponding to the particular upload list.

Note

Maximum number of upload lists allowed for saving is 50.

This feature can be illustrated with the examples below.

Multistep Upload Wizard

Using Image Uploader as a multistep upload wizard you can implement the following:

  1. Upload poor-quality thumbnails;
  2. Show users the uploaded thumbnails to request the additional upload settings for each file;
  3. After all the preparations are done, return to the Image Uploader page and restore the upload pane with files which were added on the first step.

Advanced Upload Recovering Functionality

Another application field of this feature is the advanced upload recovering functionality. In other words, you can handle the situation when the upload process was interrupted and can be resumed with the browser restart. This functionality can be implemented as follows:

  • Save the upload list before the upload process begins;
  • Rewrite the upload list every time when the current file was uploaded successfully;
  • Reset the upload list when all the files were uploaded;
  • If some unexpected error occurred and Image Uploader should be reloaded, load the last modification of the upload list.

The following code sample demonstrates how to implement this functionality.

JavaScript

<script type="text/javascript" src="iuembed.js">  </script>                       
<script language="javascript">
function fullPageLoad(){
    //Load the upload list 
	getImageUploader("ImageUploader1").LoadUploadList(1);
}

function ImageUploader1_PackageBeforeUpload() {
    //Save the upload list
	getImageUploader("ImageUploader1").SaveUploadList(1);
}

function ImageUploader1_AfterUpload() {
    //Reset the upload list
	getImageUploader("ImageUploader1").ResetUploadList(1);
}

var iu = new ImageUploaderWriter("ImageUploader", 770, 500);

// Send every file in a separate package
iu.addParam("FilesPerOnePackageCount", "1");

//Other parameters...

//Add event listeners   		    
iu.addEventListener("PackageBeforeUpload", "ImageUploader1_PackageBeforeUpload");
iu.addEventListener("AfterUpload", "ImageUploader1_AfterUpload");
iu.fullPageLoadListenerName = "fullPageLoad";

iu.writeHtml();
</script>