Ajax and JSF implement a batch upload file instance with progress bar

one. examples in NetBeans 5.5.1 :

With a "file upload" example in NetBeans 5.5.1, use this example to download and install the following software first:

JAVA SE 5 (JDK 1.5) and above (http://java.sun.com/javase/downloads/index.jsp)

NetBeans 5.5.1 (http://zh-cn.netbeans.org/index_zh_CN.html)

Sun Application Server 9.0 (https://glassfish.dev.java.net/)

2+3 can also download "NetBeans IDE 5.5.1 with Java EE application Server 9.0 U1 Patch 1 Bundle" (Http://www.netbeans.info/downloads/ind EX.PHP?RS=22&P=3)

In NetBeans, select the "Sample"-〉 "Java BluePrint Solution"->ajax programming model in the menu "new Project"-〉 "categories". Project, select File Upload. Project name defaults to "FileUpload"

Run the project "FileUpload", and select several upload files, the file types can be varied, such as PDF, jar, RA, zip, jpeg, GIF and so on. You can see the following interface.

After the transfer is complete, you can see the following results.

Shows the upload file start, the end of the time, the total number of uploaded file bytes and so on.

The project "FileUpload" under the/web/docs/has a fileupload.html document that explains the parameters and use of this upload file (中文版). File upload is a JSF control, the developer needs to know in addition to how to handle the request in the server side of the parameters, how to display the response information on the client, all you need to know is only some parameter settings. As shown in the code in this example:

The parameters are as follows:

Id	Identity of File upload JSF control
Serverlocationdir	The destination directory where the file is uploaded. The application of this parameter is not given in the demonstration example. By default, files are uploaded to the Domains/domain1/lib/upload directory of Sun application Server.
Retfunction	A JavaScript callback function that is used for client-side response information returned by the server.
Retmimetype	Server-side returns the type of response information, by default, "Text/xml"
Postprocessingmethod	The method that the server side uses to process the request information.
Progressbardivid	ID of the progress bar
Progressbarsubmitid	The ID of the trigger file upload associated with the progress bar. The demo example is the "Submit" button.
Progressbarsize	The size of the progress bar

two. creating an instance using the fileupload control photoalbum

Here is another small example of using this upload file PhotoAlbum, the most important is to explain how to extract the uploaded file name, and how to use AJAX technology to partially refresh the upload page. Also want to use this example to develop the general process of JSF programs with NetBeans.

1. In NetBeans, select the menu "New project." Category, select Web application in the project.

2. New Web application window, enter and select the following:

Project Name: PhotoAlbum

Source code structure: Java Blueprints

Server: Sun Java System Application Server 9

Java EE version: Java EE 5

Note: If "Sun Java System Application Server 9" is not present in the server selection. In NetBeans, select Menu "Window"-> "Run Time". In the Run Environment window, right-click the server and click Add Server. In the Platform folder location, select the directory where you want to install the Sun Java System application Server 9. In the next window, enter the server's administrative user name and password (the default admin username and password is "Admin/adminadmin").

3. In the next window, select the Java Server Faces framework. Click "Finish"

4. Select the library in Project "PhotoAlbum", right-click the Add Jar/folder, and add several jar files required for file upload. Under the NetBeans installation directory, such as c:/java/netbeans-5.5.1/enterprise3/modules/ext/blueprints, add the following five jar files

Shale-remoting.jar

Bp-ui-5.jar

Commons-logging-1.1.jar

Commons-io-1.2.jar

Commons-fileupload-1.1.1.jar

Note that in order to complete the following example, there are two jar files that need to be compared to the new version and need to join the library Rome-0.8.jar. For convenience, this article gives the download jar file,

The final library file is six:

Shale-remoting-1.0.4.jar (http://download.csdn.net/source/236129)

Bp-ui-5-0.8.jar (http://download.csdn.net/source/236127)

Rome-0.8.jar (http://download.csdn.net/source/236128)

Commons-logging-1.1.jar

Commons-io-1.2.jar

Commons-fileupload-1.1.1.jar

5. In the Web directory in Project "PhotoAlbum", create a directory images manually. If PhotoAlbum's working directory is e:/mymodules/photoalbum, then the absolute path to this directory is: E:/mymodules/photoalbum/web/images.

6. Create a JSF Bean, right-click the project "PhotoAlbum" and select "New File/folder". Select Web in category, select JSF managed bean in file type

7. New JSF Managed Bean window, enter:

Class Name: Fileuploadbackbean

Package: COM.SUN.SDN.DEMO.JSF

After you create this step, you can view "Faces-config.xml" under "Configuration Files" in Project "PhotoAlbum" to see that the "Fileuploadbackbean" you just created has been automatically added to the configuration file.

< Managed-bean >
< Managed-bean-name > Fileuploadbackbean </managed-bean-name >
< Managed-bean-class > Com.sun.sdn.demo.jsf.FileUploadBackBean </managed-bean-class >
< Managed-bean-scope > Request </managed-bean-scope >
</Managed-bean >

8. Add the following code to the Fileuploadbackbean:

 /**//*
 * fileuploadbackbean.java
 *
 * Created on  August 27, 2007,  pm 2:48
 *
 * To change this template, choose  Tools | template manager
 * and open the template in the  editor.
 */

Package  com.sun.sdn.demo.jsf
Import  java.util.enumeration;
Import   java.util.Hashtable;
Import  java.io.IOException;

Import  javax.faces.context.facescontext;
Import  javax.faces.context.responsewriter;
Import  javax.servlet.ServletContext;
Import  org.apache.shale.remoting.faces.ResponseFactory;

Import  com.sun.javaee.blueprints.components.ui.fileupload.fileuploadstatus;