[原创]VB.net技巧之五------在DataGrid中显示图片

在数据表userlist 中有一个字段 foto 用来存放图片的路径(包括图片文件名)，为了在 DataGrid 的 Cell 中显示实际的图片，我们可以定义一个模板列，然后给该列赋予字段foto 的值，就可以在 DataGrid 的 Cell 中显示图片.
首先请看如下代码:

WebForm2.aspx 文件：

1@ Page Language="vb" AutoEventWireup="false" Codebehind="WebForm2.aspx.vb" Inherits="house.WebForm2"

 1<html>
 2<head>
 3<title>WebForm2</title>
 4<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR"/>
 5<meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE"/>
 6<meta content="JavaScript" name="vs_defaultClientScript"/>
 7<meta content=" http://schemas.microsoft.com/intellisense/ie5 " name="vs_targetSchema"/>
 8</head>
 9<body ms_positioning="GridLayout">
10<form id="Form1" method="post" runat="server">
11<font face="宋体">
12<asp:datagrid height="350px" id="DataGrid1" runat="server" style="Z-INDEX: 101; LEFT: 224px; POSITION: absolute; TOP: 16px" width="272px">
13<columns>
14<asp:templatecolumn>
15<itemtemplate>
16<asp:image id="Image1" imageurl='```
17 #DataBinder.Eval(Container,"DataItem.foto") 
18```' runat="server" width="96px">
19</asp:image>
20</itemtemplate>
21</asp:templatecolumn>
22</columns>
23</asp:datagrid></font>
24</form>
25</body>
26</html>

WebForm2.aspx.vb 文件

Public Class WebForm2
Inherits System.Web.UI.Page

#Region " Web 窗体设计器生成的代码 "

'该调用是 Web 窗体设计器所必需的。

 1<system.diagnostics.debuggerstepthrough()> Private Sub InitializeComponent() 
 2
 3End Sub   
 4Protected WithEvents DataGrid1 As System.Web.UI.WebControls.DataGrid 
 5
 6'注意: 以下占位符声明是 Web 窗体设计器所必需的。   
 7'不要删除或移动它。   
 8Private designerPlaceholderDeclaration As System.Object 
 9
10Private Sub Page_Init(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Init   
11'CODEGEN: 此方法调用是 Web 窗体设计器所必需的   
12'不要使用代码编辑器修改它。   
13InitializeComponent()   
14End Sub 
15
16#End Region 
17
18Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load   
19'在此处放置初始化页的用户代码   
20Dim sql As String = " select * from userlist "   
21Dim dataset1 As New DataSet   
22dataset1 = New DataSet("dataset1") 
23
24Dim ConnectionString As String   
25ConnectionString = "Jet OLEDB:Global Partial Bulk Ops=2;Jet OLEDB:Registry Path=;Jet OLEDB:Database L" &amp; _   
26"ocking Mode=1;Data Source=""labrecord.mdb"";Jet OLEDB:Engine Type=5;Provider=""Mic" &amp; _   
27"rosoft.Jet.OLEDB.4.0"";Jet OLEDB:System database=;Jet OLEDB:SFP=False;persist sec" &amp; _   
28"urity info=False;Extended Properties=;Mode=Share Deny None;Jet OLEDB:Encrypt Dat" &amp; _   
29"abase=False;Jet OLEDB:Create System Database=False;Jet OLEDB:Don't Copy Locale o" &amp; _   
30"n Compact=False;Jet OLEDB:Compact Without Replica Repair=False;User ID=Admin;Jet" &amp; _   
31" OLEDB:Global Bulk Transactions=1" 
32
33Dim oledbconnection1 As New OleDb.OleDbConnection(ConnectionString)   
34Dim oledbDataAdapter1 As New OleDb.OleDbDataAdapter(sql, oledbconnection1)   
35oledbDataAdapter1.Fill(dataset1, "userlist")   
36oledbDataAdapter1 = Nothing 
37
38DataGrid1.DataSource = dataset1   
39DataGrid1.DataBind()   
40oledbconnection1.Close()   
41oledbconnection1 = Nothing 
42
43End Sub 
44
45End Class 
46
47**综述与总结** : 
48
49以前不知道如何在datagrid中如何显示图片的时候,在网上搜查相关技术资料的时候,很多.但是   
50往往写得很多,很杂乱.甚至把人引入误区.   
51下面我用简要的话来说明这个主题的关键: 首先要在一个页面(如本例中的 **WebForm2.aspx** )中添加一个datagrid1然后给datagrid1添加一个模板列.然后再往这个模板列中加入一个image控件.  最关键  的地方来了,那就是 
52
53<asp:templatecolumn>
54<itemtemplate>
55<asp:image id="Image1" imageurl='```
56 #DataBinder.Eval(Container,"DataItem.foto") 
57```' runat="server" width="96px">
58</asp:image>
59</itemtemplate>
60</asp:templatecolumn>   
61中蓝色的部分.即将图片的路径与 userlist 中的 foto字段绑定. 至于 **** **WebForm2.aspx.vb** 文件 **** 的作用是将   
62数据库中的表userlist 的数据与datagrid1绑定.</system.diagnostics.debuggerstepthrough()>