The application of SwF upload control in asp.net and MVC

Source: Internet
Author: User

Find the kit

If not, go to my resource space to download first

http://download.csdn.net/source/1860028
It contains 3 kinds of files.
(1) Ashx
(2) Swf
(3) Swfuoload.js
(4) Xpbuttonnotext_160x22.png Pictures
Copy him to the project, specifically, you can put it on demand

How to use:
(1): Introduction of Swfupload.js File
<script type= "Text/javascript" src= "Kit/swfupload.js" ></script>

(2): Copy the following code into the project.
    <script type= "Text/javascript"
        var SWFU;
        window.onload = function () {
             swfu = new SWFUpload ({
                //Backend Settings
                 upload_url: "Packet/ashx/upload.ashx",
                 post_params: {
                     "Aspsessid": "<%= Session.SessionID%> "
                },

               //File Upload Settings
                File_ Size_limit: "5 MB",
                 File_Types: "*.jpg;*.png;*.gif;*.bmp;*.jpeg",
                 file_types_description: "JPG Images",

               //Event Handler Settings
                File_ Dialog_complete_handler:function (numfilesselected, numfilesqueued) {if (numfilesqueued > 0) this.startUpload ();},
                Upload_success_ Handler:function (file, responsetext) {
                     alert ("Picture upload succeeded.") Upload before the name is: "+ File.name +" After uploading the file name: "+ responsetext";
                     document.getElementById ("path"). Value = File.name;
               },

Button settings
Button_image_url: "~/Information Package/xpbuttonnotext_160x22.png",
button_placeholder_id: "Spanbuttonplaceholder",
button_width:160,
Button_height:22,
Button_text: ' Click Browse Upload (&lt;3m) ',
Button_text_style: '. button {Font-family:helvetica, Arial, Sans-serif; font-size:14pt;} buttonsmall {font-size:10pt ; }',
Button_text_top_padding:1,
Button_text_left_padding:5,

Flash Settings
Flash_url: "Kit/swf/swfupload.swf",//relative to this file

Debug Settings
Debug:false
});
}
</script>
which
Upload_url: Path to Ashx
File_size_limit: Maximum limit for uploading
File_Types: Type of upload
File_types_description: File type description for upload

Upload_success_handler:function (file, responsetext) {} file uploaded after the success of the event. Can write content on demand
Where the parameter File.name file is uploaded before the name
ResponseText the name after the file is uploaded
BUTTON_PLACEHOLDER_ID: The ID of the control
Flash_url as the swfupload.swf path
The others are very simple, they are not introduced.
Please modify the above parameters according to your own specific situation.


(3) Find the Upload.ashx in the Ashx folder
Find this code upload. SaveAs (Path.Combine) (context. Server.MapPath ("Upload"), name);
The absolute path saved here. Context. Server.MapPath ("upload") means that the project upload.ashx the current path to the upload folder under which name is the filename
We're going to build a folder in the directory upload to store uploaded files.
Change upload. SaveAs (Path.Combine) (context. Server.MapPath (".. /.. /upload "), name);
The uploaded file is saved in the Upload folder.

(4) Set configuration file Web.config
Add under </system.web> node
<location path= "Information Package/ashx/upload.ashx" >
<system.web>
</system.web>
</location>
where maxrequestlength= "3100" is the maximum limit of 3M timeout for executiontimeout= "300"

(5) When used, add the following code:
<div style= "Float:left" ><input type= "text" id= "Path"/></div>
<div style= "Float:left" ><div id= "Spanbuttonplaceholder" ></div></div>

The upload control is done here. Click to run, have you learned it.

(MVC is similar to this one, and it's no longer elaborate.) Note that in MVC <input type= "text" id= "path"/>id cannot be the path keyword

and the content folder under MVC. If you want to use a relative path, it's best to go back to the content folder, and then look down.

Related Article

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.