Asp.net supports multiple file upload server controls

Source: Internet
Author: User

In the B/S project, "File Upload" is a common function and has many implementation methods. I prefer to use a third-party Upload Component uploadify because it is powerful, the configuration is also flexible (Multi-file, upload progress display, file type, file size, file quantity, selection button style settings, various control over the upload process, and various event responses ).

Previous usage:

1. register the required JavaScript and CSS

2. Configure with JavaScript

3. Background ProcessingProgramUpload

 

I am a lazy and think it is too troublesome to encapsulate the Asp.net Server Control.

Current usage:

You no longer need to add JS, CSS, images, Flash, and other files to the project. You do not need to configure JavaScript or write background processing programs. You only need to use controls directly.

1. Introduce uploadify_simple_aspnet.dll

2. register and use

View code

 1 <% @ Register Assembly = "  Uploadify_simple_aspnet  " Namespace = "  Uploadify_simple_aspnet  "  2 Tagprefix = "  PC3  " %> 3   4 <PC3: uploadifycontrol id = "  Uploadifycontrol1  " Runat = "  Server  " Auto = "  False  " Buttonimage = "  Image.png  " Buttontext = "  Browse  " Height ="  30  " Width = "  80  "   5 Filesizelimit = 0 Filetypeexts = "  *. Gif; *. jpg; *. PNG; *. BMP  " Filetypedesc = "  Image  " > 6 </PC3: uploadifycontrol>

 

3. Configure httphandlers in Web. config

View code

 
<! -- The following httphandler must be added --> "Post, get"Path ="Uploadify_simple_aspnet/*. ashx"Type ="Uploadify_simple_aspnet.uploadhandler"/> </Httphandlers>

 

Control properties:

SWF: SwF core file path (not required)

Buttontext: The text displayed on the browser button

Buttonimage: browse button image path

Width: the width (in pixels) of the browser button)

Height: the height of the browser button, in pixels)

Formdata: form data

Queuesizelimit: Maximum number of files that can be uploaded in a queue

Uploadlimit: number of files uploaded at a time

Auto: Select whether to automatically upload the file

Multi: whether to select multiple

Removecompleted: whether to remove the sequence after completion

Filesizelimit: maximum size of a single file. The value 0 indicates no limit (in MB)

Filetypedesc: file description

Filetypeexts: The suffix filter of the uploaded file (for example, *. gif; *. jpg; *. PNG; *. BMP)

 

Control Method:

Usage: add the onclick attribute to the button that needs to use this method. The attribute value is "control. Method Name ()"

View code

 1 <Input type = "  Button  "   Class = "  Shortbutton  " Id = "  Btnupload  " Value = "  Upload  " Runat ="  Server  " /> 2 & Nbsp ;& Nbsp;  3 <Input type = "  Button  "   Class = "  Shortbutton  " Id = "  Btncancelupload " Value = "  Cancel  " Runat = "  Server  " /> 4 & Nbsp ;& Nbsp;  5 <Input type = "  Button  "   Class = " Shortbutton  " Id = "  Btncancelfirst  " Value = "  Cancel the first  " Runat = "  Server  " /> 6 & Nbsp ;& Nbsp;  7 <Input type ="  Button  "   Class = "  Shortbutton  " Id = "  Btnstop  " Value = "  Stop upload  " Runat = "  Server  " />8   9   10   11           //  Upload All  12 Btnupload. Attributes. Add ( "  Onclick  "  , Uploadifycontrol1.upload ());  13           //  Cancel all  14 Btncancelupload. Attributes. Add ( " Onclick  "  , Uploadifycontrol1.cancel ());  15           //  Cancel the first  16 Btncancelfirst. Attributes. Add ( "  Onclick  "  , Uploadifycontrol1.cancelfirst ());  17           //  Stop upload  18 Btnstop. Attributes. Add ("  Onclick  " , Uploadifycontrol1.stop ());

 

Upload (): Upload All

Cancel (): cancel all

Cancelfirst (): cancel the first

Stop (): Stop upload

 

Control event:

Usage: subscribe to the upload events of the control (currently, the upload events are static)

View code

 1           //  Subscribe to file upload events (currently, uploadevent events are static)  2 Uploadifycontrol. uploadevent + = (httppostedfile file) => 3   {  4                   //  Start of upload operation business processing  5                   String Uploadpath = httpcontext. Current. server. mappath ( "  ~ \ Uploadfiles \\  "  );  6                   If (! Directory. exists (uploadpath )) 7   {  8   Directory. createdirectory (uploadpath );  9   }  10 File. saveas (uploadpath + File. filename );  11                   //  Upload operation ends  12 };

 

Uploadevent: File Upload event

 

The following is the source code of the control and the example Program (I hope you will do your best to improve it if you have any mistakes)

Control source code and example

 

This control only encapsulates common functions of uploadify, and some attribute methods are not encapsulated. If you think you need to use certain attributes or methods of uploadify, but the control does not, you can:

1. Leave a message to me or send me an email (qinjiadong369@163.com), I will try my best to improve

2. directly use uploadify

3. Download the source code of my control and complete it on your own.

Of course, I want you to tell me your requirements, so that this control can be better and more convenient.

Refer:

Http://www.uploadify.com/

Http://www.cnblogs.com/wuhuacong/archive/2012/12/01/2797679.html

 

If you thinkArticleIt is helpful to you. You can click the "recommendation" button next to it to give more people who need it a chance to see it.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.