DevExpress (5): Aspxuploadcontrol after uploading photos with aspxbinaryimage display

DevExpress Version 14.1

：

The user clicks the File Upload button, pops up the File Selection window, selects the file, automatically uploads to the server to save to the database (the big picture file is not generally small, the database is easy to manage:) You can also save to a folder on the server), and the interface uses the Binaryimage control to display the photos.

General idea:

(1) How can users automatically upload files after they select them? Add TextChanged client events to Uploadcontrol, call uploader's client UploadFile () method when the text changes

(2) Add Fileuploadcomplete event to server side, can get big picture, then save to database

(3) Binaryimage How to refresh? Because file uploads are actually callback submissions, Binaryimage cannot be refreshed in the Fileuploadcomplete event, and Binaryimage does not have a client Performcallback method. The way is to give Binaryimage a Aspxcallbackpanel, when the file upload end, call Callbackpanel client Performcallback method, and then refresh on the server binaryimage

(4) as a supplement, if you want to pass some parameters on the server and the client?

One is the use of the service-side Fileuploadcomplete E.callbackdata, you can splice strings, and then use the time to disassemble, not very convenient;

The second is to use the session, in the service side of the different events passed between the parameters, the problem is that the session is global, can not use as much as possible;

The third is to use Aspxhiddenfield hidden fields, although called field but can hold multiple properties, use or relatively convenient:)

The design interface is as follows:

Key code:

Uploadcontrol uses the client textchanged and Fileuploadcomplete events, server-side fileuploadcomplete events.

The execution order is: Client Textchanged-> server fileuploadcomplete-> client Fileuploadcomplete

<Dx:aspxuploadcontrolID= "ASPxUploadControl1"runat= "Server"Width= "99px"Clientinstancename= "Uploadcontrol"Onfileuploadcomplete= "Aspxuploadcontrol1_fileuploadcomplete">    <validationsettingsallowedfileextensions= ". jpeg,. jpg,. gif"MaxFileSize= "1048576"Maxfilesizeerrortext= "File size must not exceed 1mb!">    </validationsettings>    <clientsideeventsTextChanged= "function (s, e) {uploadcontrol.uploadfile ();}"Fileuploadcomplete= "function (s, e) {if (e.callbackdata! = undefined) callbackpanel.performcallback ("); else alert (e.callbackdata);} "  />    <BrowseButtonText= "Select">    </BrowseButton></Dx:aspxuploadcontrol>

There is to add to Callbackpanel Server callback event, fill Binaryimage contentbytes, the implementation of the refresh, this code is not posted out:)

Add:

What if my photos are not saved to the database? That's easy:

(1) Replace Aspxbinaryimage with Aspximage

(2) Fileuploadcomplete event on Uploadcontrol's server, via E. callBackData return the path of a photo

(3) in the Uploadcontrol client Fileuploadcomplete event, using the image of the client Setimageurl method, you can refresh:)

DevExpress (5): Aspxuploadcontrol after uploading photos with aspxbinaryimage display