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

        
DataBind

        
FormatImage

        
Web Form Designer generated code

        
btnsave_Click
    }
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

        
Web Form Designer generated code
    }
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  
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值