Run fileupload to preview the uploaded image.
See the results:
In the project, create An ASPX page and pull the fileupload control to preview the uploaded image.
<% @ Page Language = "C #" autoeventwireup = "true" codefile = "default2.aspx. cs" inherits = "default2" %>
<! Doctype HTML>
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<Head runat = "server">
<Title> </title>
</Head>
<Body>
<Form ID = "form1" runat = "server">
<Div>
<Table>
<Tr>
<TD style = "vertical-align: Top; width: 10%;">
<Fieldset>
<Legend> select an image </legend>
<Asp: fileupload id = "fileupload1" runat = "server"/>
</Fieldset>
</TD>
<TD style = "vertical-align: Top; width: 90%;">
<Fieldset>
<Legend> preview </legend>
<Asp: Image id = "image1" runat = "server" visible = "false"/>
</Fieldset>
</TD>
</Tr>
</Table>
</Div>
</Form>
</Body>
</Html>
In the page_init event, register the onchange client event as the fileupload control.
Protected void page_init (Object sender, eventargs E)
{
This. fileupload1.attributes. Add ("onchange", page. clientscript. getpostbackeventreference (this. fileupload1, "onchange "));
}
Next, insus. Net creates an axd processing document. In fact, imageprocessfactory. CS is just a common category and only implements the ihttphandler interface.
Press Ctrl + C to copy the code Imageprocessfactory. CS using system; using system. collections. generic; using system. drawing; using system. drawing. drawing2d; using system. drawing. imaging; using system. io; using system. LINQ; using system. web; using system. web. sessionstate; // <summary> // summary description for imageprocessfactory // </Summary> namespace insus. net {public class imageprocessfactory: ihttphandler, irequiressessi Onstate {public imageprocessfactory () {// todo: Add constructor logic here //} public void processrequest (httpcontext context) {// checking whether the uploadbytes session variable have anything else not doing anything If (context. session ["uploadbytes"])! = NULL) {byte [] buffer = (byte []) (context. session ["uploadbytes"]); context. response. binarywrite (buffer) ;}} public bool isreusable {get {return false ;}}}}Press Ctrl + C to copy the code
To apply the file to the axd file, you need to configure it in Web. config.
<Configuration>
<System. Web>
<Httphandlers>
<Add verb = "*" Path = "previewimage. axd" type = "insus. net. imageprocessfactory"/>
</Httphandlers>
</System. Web>
</Configuration>
OK. We will go back to the Aspx. CS page. In page_load, how can we monitor whether the fileupload control has a value change:
Protected void page_load (Object sender, eventargs E)
{
If (ispostback)
{
VaR CTRL = request. Params [page. posteventsourceid];
VaR ARGs = request. Params [page. posteventargumentid];
Onchangehandle (CTRL, argS );
}
}
There is a method onchangehandle (XXX, XXX) in page_load ):
Press Ctrl + C to copy the code <textarea style="width: 978px; height: 196.8px; line-height: 1.5; font-family: Courier New; font-size: 12px;">Private void onchangehandle (string Ctrl, string ARGs) {If (CTRL = This. fileupload1.uniqueid & ARGs = "onchange") {This. image1.visible = true; session ["uploadbytes"] = This. fileupload1.filebytes; this. image1.imageurl = "~ /Previewimage. axd ";}}</textarea> Press Ctrl + C to copy the code
Fileupload image Preview