ASP. NET 2.0 no refresh image upload display thumbnail specific implementation

Simple three-step implementation of the picture without refreshing upload: Note is uploaded, as for the verification of the upload, compared to the size of the film, size, format judgment, restrictions, etc., self-solve.

Compatibility wants to be good: Ff,ch,ie, cheetah, all can be realized. If you see echo. Of course it was a success.

After a few days of constant in the end, finally the two goods out. It was a great painstaking. But the moment of making out is quite happy.

The first step: we need to load several JS libraries.

jquery Library

Jquery.form.js Library

Download the two libraries and reference them to the page.

The following is the JS code on the page:

function upload () {    var options = {        type: "POST",                            //Of course this is the delivery method        URL: '. /include/files.ashx ',        //General handler path        success:function (msg) {        ////Return parameter            $ ("#server_img"). attr ("src", msg);            echo the picture.        }     };     Pass the options to Ajaxform     $ (' #aspnetForm '). Ajaxsubmit (options);}

Step two: code within the general handler

public void ProcessRequest (HttpContext context) {httpfilecollection files = context.              Request.Files; Gets the file object if (files.                                                            Count > 0) {String path = "";            Path string Random rnd = new Random (); for (int i = 0; i < files. Count;                                        i++) {Httppostedfile file = Files[i]; Gets the file object if (files. ContentLength > 0) {string fileName = file.                    FileName;                    string extension = Path.getextension (fileName); int num = rnd.                            Next (5000, 10000); File name path = ".. /.. /userfiles/temp/"+ Num.                    ToString () + extension; File.        SaveAs (System.Web.HttpContext.Current.Server.MapPath (path));                Save the file. }} context.            Response.Write (path); //returns the path after the file is stored for Echo. }}

Step three: Code in HTML or ASPX.
The following two lines of code are literally inserted anywhere in the HTML or ASPX. It's all possible to think.

   //For echoing picture <asp:fileupload id= "up_load" runat= "server" onchange= "Upload ()"  Ontextchange= "Upload ()"/>  //upload pictures, automatic, two events are to ensure that all browsers are compatible.

　　

ASP. NET 2.0 no refresh image upload display thumbnail specific implementation