DataGrid显示图片(物理路径式和Stream流式)和添加图片到数据库

1.建立页面ImageGrid
1.1 html代码

< HTML >
     < HEAD >
         < title > ImageGrid </ title >
         < meta  name ="GENERATOR"  Content ="Microsoft Visual Studio .NET 7.1" >
         < meta  name ="CODE_LANGUAGE"  Content ="C#" >
         < meta  name ="vs_defaultClientScript"  content ="JavaScript" >
         < meta  name ="vs_targetSchema"  content ="http://schemas.microsoft.com/intellisense/ie5" >
     </ HEAD >
     < body  MS_POSITIONING ="GridLayout" >
         < form  id ="Form1"  method ="post"  runat ="server" >
             < asp:DataGrid  id ="DataGrid1"  style ="Z-INDEX: 101; LEFT: 8px; POSITION: absolute; TOP: 80px"  runat ="server"
                AutoGenerateColumns ="False"  BorderColor ="#CC9966"  BorderStyle ="None"  BorderWidth ="1px"  BackColor ="White"
                CellPadding ="4" >
                 < FooterStyle  ForeColor ="#330099"  BackColor ="#FFFFCC" ></ FooterStyle >
                 < SelectedItemStyle  Font-Bold ="True"  ForeColor ="#663399"  BackColor ="#FFCC66" ></ SelectedItemStyle >
                 < ItemStyle  ForeColor ="#330099"  BackColor ="White" ></ ItemStyle >
                 < HeaderStyle  Font-Bold ="True"  ForeColor ="#FFFFCC"  BackColor ="#990000" ></ HeaderStyle >
                 < Columns >
                     < asp:TemplateColumn  HeaderText ="姓名" >
                         < ItemTemplate >
                             < asp:Label  Runat ="server"  Text ='<%#  DataBinder.Eval(Container.DataItem, "UserName") % > ' ID="Label1"/>
                         </ ItemTemplate >
                     </ asp:TemplateColumn >
                     < asp:TemplateColumn  HeaderText ="Stream(流)方式" >
                         < ItemTemplate >
                             < asp:Image  Runat =server  ID ="Image1"  ImageUrl ='<%#  FormatImage(DataBinder.Eval(Container.DataItem, "UserID")) % > ' />
                         </ ItemTemplate >
                     </ asp:TemplateColumn >
                     < asp:TemplateColumn  HeaderText ="物理路径方式" >
                         < ItemTemplate >
                             < asp:Image  Runat =server  ID ="Image2"  ImageUrl ='<%#  DataBinder.Eval(Container.DataItem, "Path") % > ' />
                         </ ItemTemplate >
                     </ asp:TemplateColumn >
                 </ Columns >
                 < PagerStyle  HorizontalAlign ="Center"  ForeColor ="#330099"  BackColor ="#FFFFCC" ></ PagerStyle >
             </ asp:DataGrid >
             < asp:Button  id ="btnsave"  style ="Z-INDEX: 104; LEFT: 248px; POSITION: absolute; TOP: 48px"  runat ="server"
                Text ="保存" ></ asp:Button >< INPUT  style ="Z-INDEX: 102; LEFT: 64px; POSITION: absolute; TOP: 8px"  type ="file"  id ="File1"
                name ="File1"  runat ="server" >
             < asp:Button  id ="btnsearch"  style ="Z-INDEX: 103; LEFT: 304px; POSITION: absolute; TOP: 48px"
                runat ="server"  Text ="刷新" ></ asp:Button >
             < asp:TextBox  id ="txtUserName"  style ="Z-INDEX: 105; LEFT: 72px; POSITION: absolute; TOP: 48px"
                runat ="server" ></ asp:TextBox >
             < asp:Label  id ="Label2"  style ="Z-INDEX: 106; LEFT: 8px; POSITION: absolute; TOP: 16px"  runat ="server" > 照片 </ asp:Label >
             < asp:Label  id ="Label3"  style ="Z-INDEX: 107; LEFT: 8px; POSITION: absolute; TOP: 56px"  runat ="server" > 姓名 </ asp:Label >
         </ form >
     </ body >
</ HTML >

1.2 cs代码

public   class  ImageGrid : System.Web.UI.Page
     {
        protected System.Web.UI.WebControls.Button btnsave;
        protected System.Web.UI.WebControls.Button btnsearch;
        protected System.Web.UI.WebControls.Label Label2;
        protected System.Web.UI.WebControls.Label Label3;
        protected System.Web.UI.HtmlControls.HtmlInputFile File1;
        protected System.Web.UI.WebControls.TextBox txtUserName;
        protected System.Web.UI.WebControls.DataGrid DataGrid1;
        
        private void Page_Load(object sender, System.EventArgs e)
        {
            DataBind();
        }

        GetDataSet#region GetDataSet
        private DataSet GetDataSet(string sql)
        {
            string constring=System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
            SqlDataAdapter    sda =new SqlDataAdapter(sql,constring);
            DataSet ds=new DataSet();
            sda.Fill(ds);
            return ds;
        }
        #endregion

        DataBind#region DataBind
        private void DataBind()
        {
            string sql="select * from testimage";
            DataSet ds=GetDataSet(sql);
            this.DataGrid1.DataSource=ds;
            this.DataGrid1.DataBind();
        }
        #endregion

        FormatImage#region FormatImage
        protected string FormatImage(object obj)
        {
            return "ReadImage.aspx?UserID=" + obj.ToString();
        }
        #endregion

        Web Form Designer generated code#region Web Form Designer generated code
        override protected void OnInit(EventArgs e)
        {
            //
            // CODEGEN: This call is required by the ASP.NET Web Form Designer.
            //
            InitializeComponent();
            base.OnInit(e);
        }
        
        /**//// <summary>
        /// Required method for Designer support - do not modify
        /// the contents of this method with the code editor.
        /// </summary>
        private void InitializeComponent()
        {    
            this.btnsave.Click += new System.EventHandler(this.btnsave_Click);
            this.Load += new System.EventHandler(this.Page_Load);

        }
        #endregion

        btnsave_Click#region btnsave_Click
        private void btnsave_Click(object sender, System.EventArgs e)
        {            
            Stream ImageStream;
            string Path=File1.PostedFile.FileName;// 文件名称
            int Size = File1.PostedFile.ContentLength; // 文件大小
            string Type = File1.PostedFile.ContentType; // 文件类型
            ImageStream = File1.PostedFile.InputStream;
            byte[] Content = new byte[Size];
            int Status = ImageStream.Read(Content, 0, Size);

            // 写入数据库
            SqlConnection conn=new SqlConnection(System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"]);
            SqlCommand comm=new SqlCommand("insert into testimage (UserName,Image,Path,Type) values(@UserName,@Image,@Path,@Type)",conn);

            comm.CommandType = CommandType.Text;
            comm.Parameters.Add("@UserName", SqlDbType.VarChar, 255).Value = txtUserName.Text;            
            comm.Parameters.Add("@Image", SqlDbType.Image).Value = Content;
            comm.Parameters.Add("@Path", SqlDbType.VarChar, 255).Value = Path;
            comm.Parameters.Add("@Type", SqlDbType.VarChar, 255).Value = Type;

            conn.Open();
            comm.ExecuteNonQuery();
            conn.Close();
            DataBind();
        }
        #endregion
    }

2.建立ReadImage页面,用于输出文件流式图片
2.1 html代码

< HTML >
     < HEAD >
         < title > ReadImage </ title >
         < meta  name ="GENERATOR"  Content ="Microsoft Visual Studio .NET 7.1" >
         < meta  name ="CODE_LANGUAGE"  Content ="C#" >
         < meta  name ="vs_defaultClientScript"  content ="JavaScript" >
         < meta  name ="vs_targetSchema"  content ="http://schemas.microsoft.com/intellisense/ie5" >
     </ HEAD >
     < body  MS_POSITIONING ="GridLayout" >
         < form  id ="Form1"  method ="post"  runat ="server" >
             < FONT  face ="宋体" ></ FONT >
         </ form >
     </ body >
</ HTML >

2.2 cs代码

public   class  ReadImage : System.Web.UI.Page
     {
        private void Page_Load(object sender, System.EventArgs e)
        {
            int UserID = Convert.ToInt32(Request["UserID"]);
            string sql="select * from testimage where UserID="+UserID;
            DataSet ds = GetDataSet(sql);

            if (ds != null && ds.Tables[0].Rows.Count>0)
            {
                Response.Clear();
                Response.ContentType = ds.Tables[0].Rows[0]["Type"].ToString();
                Response.BinaryWrite((byte[])ds.Tables[0].Rows[0]["Image"]);
                Response.End();              
            }    
        }

        GetDataSet#region GetDataSet
        private DataSet GetDataSet(string sql)
        {
            string constring=System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
            SqlDataAdapter    sda =new SqlDataAdapter(sql,constring);
            DataSet ds=new DataSet();
            sda.Fill(ds);
            return ds;
        }
        #endregion

        Web Form Designer generated code#region Web Form Designer generated code
        override protected void OnInit(EventArgs e)
        {
            //
            // CODEGEN: This call is required by the ASP.NET Web Form Designer.
            //
            InitializeComponent();
            base.OnInit(e);
        }
        
        /**//// <summary>
        /// Required method for Designer support - do not modify
        /// the contents of this method with the code editor.
        /// </summary>
        private void InitializeComponent()
        {    
            this.Load += new System.EventHandler(this.Page_Load);
        }
        #endregion
    }

3.数据库脚本

if   exists  ( select   *   from  dbo.sysobjects  where  id  =   object_id (N ' [dbo].[TestImage] ' )  and   OBJECTPROPERTY (id, N ' IsUserTable ' )  =   1 )
drop   table   [ dbo ] . [ TestImage ]
GO

CREATE   TABLE   [ dbo ] . [ TestImage ]  (
     [ UserID ]   [ int ]   IDENTITY  ( 1 ,  1 )  NOT   NULL  ,
     [ UserName ]   [ nvarchar ]  ( 500 ) COLLATE Chinese_PRC_CI_AS  NULL  ,
     [ Image ]   [ image ]   NULL  ,
     [ Path ]   [ nvarchar ]  ( 500 ) COLLATE Chinese_PRC_CI_AS  NULL  ,
     [ Type ]   [ nvarchar ]  ( 20 ) COLLATE SQL_Latin1_General_CP1_CI_AS  NULL  
)  ON   [ PRIMARY ]  TEXTIMAGE_ON  [ PRIMARY ]
GO

4.源代码下载 /Files/singlepine/WebApplication2.rar