二、数据库（暂无）

三、新建一个网站

3.1、Default.aspx代码

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="ext-3.2.0/resources/css/ext-all.css" rel="stylesheet" type="text/css"/>

<script src="ext-3.2.0/adapter/ext/ext-base.js" type="text/javascript"></script>

<script src="ext-3.2.0/ext-all.js" type="text/javascript"></script>

<script src="ext-3.2.0/src/locale/ext-lang-zh_CN.js" type="text/javascript"></script>
<link href="UploadFile/fileuploadfield.css" rel="stylesheet" type="text/css"/>
<script src="UploadFile/FileUpLoadField.js" type="text/javascript"></script>
<script type="text/javascript">
        Ext.QuickTips.init();
        Ext.form.Field.prototype.msgTarget ='side';
        Ext.onReady(function() {
            var form =new Ext.form.FormPanel({
                baseCls: 'x-plain',
                labelWidth: 80,
                url: 'upload.ashx',
                fileUpload: true,
                defaultType: 'textfield',

                items: [{
                    xtype: 'textfield',
                    fieldLabel: 'File Name',
                    name: 'userfile',
                    inputType: 'file',
                    allowBlank: false,
                    blankText: 'File can\'t not empty.',
                    anchor: '90%'// anchor width by percentage
}]
                });

                var win =new Ext.Window({
                    title: 'Upload file',
                    width: 400,
                    height: 200,
                    minWidth: 300,
                    minHeight: 100,
                    layout: 'fit',
                    plain: true,
                    bodyStyle: 'padding:5px;',
                    buttonAlign: 'center',
                    items: form,

                    buttons: [{
                        text: 'Upload',
                        handler: function() {
if (form.form.isValid()) {
                                Ext.MessageBox.show({
                                    title: 'Please wait',
                                    msg: 'Uploading...',
                                    progressText: '',
                                    width: 300,
                                    progress: true,
                                    closable: false,
                                    animEl: 'loding'
                                });
                                form.getForm().submit({
                                    success: function(form, action) {
                                        Ext.Msg.alert('Message from extjs.org.cn', action.result.msg);
                                        win.hide();
                                    },
                                    failure: function() {
                                        Ext.Msg.alert('Error', 'File upload failure.');
                                    }
                                })
                            }
                        }
                    }, {
                        text: 'Close',
                        handler: function() { win.hide(); }
}]
                    });
                    win.show();
                });
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="FileUpload1" runat="server"/>
<asp:Button ID="Button1" runat="server"
            Text="上传" onclick="Button1_Click"/>
</div>
<asp:Image ID="Image1" runat="server"/><br />
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</form>
</body>
</html>

3.2、Default.aspx.cs代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

publicpartialclass _Default : System.Web.UI.Page
{
protectedvoid Page_Load(object sender, EventArgs e)
    {
if (!IsPostBack)
        {
        }
    }
protectedvoid Button1_Click(object sender, EventArgs e)
    {
/** 文件是否为空 **/
bool fileIsValid =false;

if (FileUpload1.HasFile)
        {
/** 获取上传文件的后缀 **/
string fileExtension = System.IO.Path.GetExtension(FileUpload1.FileName).ToLower();
string[] restrictExtension = { ".gif", ".jpg", ".bmp", ".png" };
/** 判断文件类型是否符合要求 **/
for (int i =0; i < restrictExtension.Length; i++)
            {
if (fileExtension == restrictExtension[i])
                {
                    fileIsValid =true;
                }
            }
        }
/** 如果文件类型符合要求，调用SaveAs方法实现上传，并显示相关信息 **/
if (fileIsValid ==true)
        {
try
                {
                    Image1.ImageUrl ="~/"+ FileUpload1.FileName;
                    FileUpload1.SaveAs(Server.MapPath("~/") + FileUpload1.FileName);
                    Label1.Text="文件上传成功";
                    Label1.Text+="<br />";
                    Label1.Text+="<li>"+"原文件路径："+FileUpload1.PostedFile.FileName;
                    Label1.Text+="<br />";
                    Label1.Text+="<li>"+"文件大小："+FileUpload1.PostedFile.ContentLength+"字节";
                    Label1.Text+="<br />";
                    Label1.Text+="<li>"+"文件类型："+FileUpload1.PostedFile.ContentType;
                }
catch
                {
                    Label1.Text="文件上传成功";
                }
        }
else
        {
            Label1.Text="只能够上传后缀为.gif,.jpg,.bmp,.png的文件夹";
        }
    }
}

3.3、upload.ashx代码

<%@ WebHandler Language="C#" Class="upload"%>

using System;
using System.Web;

using System.IO;
publicclass upload : IHttpHandler
{

publicvoid ProcessRequest(HttpContext context)
    {
        context.Response.ContentType ="text/html";
        UpLoadImage(context);
    }
string serverpath ="";
string savepath ="";
privatestring json ="";
publicvoid UpLoadImage(HttpContext content)
    {
try
        {
if (content.Request.Files.Count >0)
            {
                HttpPostedFile postedFile = content.Request.Files[0];
                serverpath = content.Server.MapPath("~/");
                savepath = serverpath + Path.GetFileName(postedFile.FileName);
if (File.Exists(savepath))
                {
                    json ="{success:false,'msg':'该图片已经存在！'}";
                }
else
                {
                    postedFile.SaveAs(savepath);
                    json ="{success:true,'msg':'上传成功！'}";
                }
            }
else
            {
                json ="{success:false,'msg':'获取文件异常！'}";
            }
        }
catch (Exception ex)
        {
            json ="{success:false,'msg':'"+ ex.Message +"！'}";
        }
        content.Response.Write(json);
        content.Response.End();
    }
publicbool IsReusable
    {
get
        {
returnfalse;
        }
    }

}