第六讲 ASP.NET应用：DataGrid使用最佳实践
*摘要
-列表控件概述
-列表控件是如何工作的
-DataGrid基本使用
-DataGrid常用的使用技巧
-DataGrid其他使用技巧
*列表控件概述
.能够取得数据集，并自动遍历它们
.比其他控件要复杂的多
.这些控件把绑定到它们的数据通过HTML表现出来
.常用作其他实际显示数据的控件的容器
.功能强大、较复杂
.用于以下应用：报表、购物推车、产品列表、查询结果显示、导航菜单
*列表控件是如何工作的
-DataSource属性： 最简单地讲，就是一组相同特征的对象或者一个相同对象的集合
-Items集合 ：每一个列表绑定控件都有一个Items集合，集合中的每一个Item是DataSource所指定的一个对象
*数据绑定
-列表绑定控件基于ASP.NET框架，需要你明确地进行数据绑定。这就意味着：只有当DataBind方法被调用时，才真正
需要轮询其DataSource 所代表的数据。
-当DataBind方法被调用时，列表绑定控件将轮询DataSource，创建Items集合，并从DataSource取回数据，以初始化
Items集合
*DataGrid基本使用
-DataGrid控件可用于创建各种样式的表格。它还支持对项目的选择和操作，是最复杂、功能最强大！
-DataGrid的AutoGenerateColumns属性缺省是True。当AutoGenerateColumns为True 时，DataGrid将检查其数据源和
其对象映射，并为每一个共有属性或者字段创建一个列。
-每一个自动产生的列称为一个BoundColumn（绑定列）。绑定列根据其数据表对应列的数据类型，自动将其转化为一
个字符串，显示在表格的一个单元中。
*DataGrid列的类型包括：
绑定列
模板列
编辑和删除列
*事件
编辑
取消
更新
删除
分页
*DataGrid常用的使用技巧
.日期的显示
d 将日显示为不带前导零的数字（如 1）。
dd 将日显示为带前导零的数字（如 01）。
ddd 将日显示为缩写形式（例如 Sun）。
dddd 将日显示为全名（例如 Sunday）。
M 将月份显示为不带前导零的数字（如一月表示为 1）
MM 将月份显示为带前导零的数字（例如 01/12/01）。
MMM 将月份显示为缩写形式（例如 Jan）。
MMMM 将月份显示为完整月份名（例如 January）。
h 使用12 小时制将小时显示为不带前导零的数字（例如 1:15:15 PM）。
hh 使用 12 小时制将小时显示为带前导零的数字（例如 01:15:15 PM）。
H 使用 24 小时制将小时显示为不带前导零的数字（例如 1:15:15）。
HH 使用 24 小时制将小时显示为带前导零的数字（例如 01:15:15）。
m 将分钟显示为不带前导零的数字（例如 12:1:15）。
mm 将分钟显示为带前导零的数字（例如 12:01:15）。
s 将秒显示为不带前导零的数字（例如 12:15:5）。
ss 将秒显示为带前导零的数字（例如 12:15:05）。
y 将年份 (0-9) 显示为不带前导零的数字。
yy 以带前导零的两位数字格式显示年份（如果适用）。
yyy 以三位数字格式显示年份。
yyyy 以四位数字格式显示年份。
<asp:BoundColumn DataField="Birthday" HeaderText="生日" DataFormatString="{0:yyyy-M-d}"></asp:BoundColumn>
.传递DataGrid中的值
<asp:HyperLinkColumn Text="点击查看" DataNavigateUrlField="StudentID" DataNavigateUrlFormatString="Show.aspx?ID={0}" DataTextField="StudentName" HeaderText="详细信息"></asp:HyperLinkColumn>
show.aspx.cs中的代码
Response.Write("您选择的学生ID是:"+Request.QueryString["ID"]);
.在DataGrid里添加确认删除的对话框
-第一种方法
1、在DataGrid_ItemCreated()事件中加myDeleteButton.Attributes.Add(...)属性(客户端脚本)
private void dgShow_ItemCreated(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
switch(e.Item.ItemType)
{
case ListItemType.Item:
case ListItemType.EditItem:
case ListItemType.AlternatingItem:
Button myDeleteButton = (Button)e.Item.FindControl("btnDelete");
myDeleteButton.Text = "删除此行";
myDeleteButton.Attributes.Add("onclick", "return confirm('您真的要删除第 " + e.Item.ItemIndex.ToString() + " 行吗？');");
break;
}
}
2、再在DataGrid_ItemCommand(...)事件中，写服务器端功能代码
private void dgShow_ItemCommand(object source, System.Web.UI.WebControls.DataGridCommandEventArgs e)
{
if(e.CommandName=="UserDelete")
dgShow_DeleteCommand(source,e);
}
-第二种方法
1、直接在模板列中添加客户端脚本
<asp:TemplateField HeaderText="删除" ShowHeader="False">
<ItemTemplate>
<asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False"onclientclick="return confirm("删除将不能恢复,确认要删除吗?")" Text="删除" CommandName="Delete">
</asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
2、服务器端代码同上。
.格式化DataGrid ：将数据原中的0,1值转换成实际的文字
<asp:TemplateColumn HeaderText="性别模板列">
<ItemTemplate>
<asp:RadioButton id=RadioButton2 runat="server" Text="男" Checked='<%# DataBinder.Eval(Container, "DataItem.Sex") %>' Enabled="False"></asp:RadioButton>
<asp:RadioButton id=RadioButton1 runat="server" Text="女" Checked='<%# !(bool)DataBinder.Eval(Container, "DataItem.Sex") %>' Enabled="False"></asp:RadioButton>
</ItemTemplate>
<EditItemTemplate>
<asp:RadioButton id=cbSex runat="server" Text="男" Checked='<%# DataBinder.Eval(Container, "DataItem.Sex") %>' GroupName="Sex"></asp:RadioButton>
<asp:RadioButton id=RadioButton4 runat="server" Text="女" Checked='<%# !(bool)DataBinder.Eval(Container, "DataItem.Sex") %>' GroupName="Sex"></asp:RadioButton>
</EditItemTemplate>
</asp:TemplateColumn>
.在DataGrid中选择,确认,删除多行复选框列表
1、添加一个“选择模板列”。
<asp:TemplateColumn HeaderText="选择">
<HeaderTemplate>
<asp:CheckBox id="cbAll" runat="server" OnCheckedChanged="CheckAll" Text="全选" AutoPostBack="True"></asp:CheckBox>
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox id="cbSelect" runat="server" AutoPostBack="True"></asp:CheckBox>
</ItemTemplate>
</asp:TemplateColumn>
2、在CheckAll事件中添加代码
public void CheckAll(object sender, System.EventArgs e)
{
CheckBox cbAll = (CheckBox)sender;
if(cbAll.Text=="全选")
{
foreach(DataGridItem dgi in dgShow.Items)
{
CheckBox cb = (CheckBox)dgi.FindControl("cbSelect");
cb.Checked = cbAll.Checked;
}
}
}
.利用dropdownlist下拉列表框，显示数据库表中的某个字段
1、添加模板列
<asp:TemplateColumn HeaderText="性别模板列">
<ItemTemplate>
<asp:DropDownList id="ddlSexI" runat="server" Enabled="False">
<asp:ListItem Value="1">男</asp:ListItem>
<asp:ListItem Value="0">女</asp:ListItem>
</asp:DropDownList>
</ItemTemplate>
<EditItemTemplate>
<asp:DropDownList id="ddlSexE" runat="server">
<asp:ListItem Value="1">男</asp:ListItem>
<asp:ListItem Value="0">女</asp:ListItem>
</asp:DropDownList>
</EditItemTemplate>
</asp:TemplateColumn>
2、数据绑定时，额外的绑定代码
private void BindData()
{
string strCon = System.Configuration.ConfigurationSettings.AppSettings["DSN"];
SqlConnection con = new SqlConnection(strCon);
SqlDataAdapter da = new SqlDataAdapter("Select * from tbStudentinfo",con);
DataSet ds = new DataSet();
da.Fill(ds,"studentinfo");
dgShow.DataSource = ds.Tables["studentinfo"].DefaultView;
dgShow.DataBind();
foreach(DataGridItem dgi in dgShow.Items)
{
//以下绑定非编辑状态下拉列表
DropDownList ddI = (DropDownList)dgi.FindControl("ddlSexI");
if(ddI!=null)
{
bool bSex = (bool)ds.Tables["studentinfo"].Rows[dgi.ItemIndex]["Sex"];
if(bSex)
ddI.SelectedIndex = 0;
else
ddI.SelectedIndex = 1;
}
//以下绑定编辑状态下拉列表
DropDownList ddE = (DropDownList)dgi.FindControl("ddlSexE");
if(ddE!=null)
{
bool bSex = (bool)ds.Tables["studentinfo"].Rows[dgi.ItemIndex]["Sex"];
if(bSex)
ddE.SelectedIndex = 0;
else
ddE.SelectedIndex = 1;
}
}
}
.取得Datagrid里的checkbox返回值
string strSex = ((CheckBox)(e.Item.Cells[3].FindControl("cbSex"))).Checked?"1":"0";
.datagrid中加入统计值
1、显示页脚：ShowFooter="True"
2、数据绑定时额外添加绑定代码
private void BindData()
{
string strCon = System.Configuration.ConfigurationSettings.AppSettings["DSN"];
SqlConnection con = new SqlConnection(strCon);
SqlDataAdapter da = new SqlDataAdapter("Select * from tbStudentinfo",con);
DataSet ds = new DataSet();
da.Fill(ds,"studentinfo");
dgShow.DataSource = ds.Tables["studentinfo"].DefaultView;
dgShow.DataBind();
//以下作分数和的统计
int count=0;
for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
{
count += int.Parse(ds.Tables[0].Rows[i]["Score"].ToString());
}
int nAv = count/ds.Tables[0].Rows.Count;
foreach(DataGridItem dgi in dgShow.Controls[0].Controls)
{
if (dgi.ItemType == ListItemType.Footer)
dgi.Cells[6].Text = "平均："+nAv.ToString();
}
}
.DataGrid_UpdateCommand(...)事件这么写
private void dgShow_UpdateCommand(object source, System.Web.UI.WebControls.DataGridCommandEventArgs e)
{
string strStudentID = e.Item.Cells[0].Text;//处于非编辑状态
string strName = ((TextBox)(e.Item.Cells[1].Controls[0])).Text;//处于编辑状态
string strPass =((TextBox)(e.Item.Cells[2].Controls[0])).Text;
string strSex = ((CheckBox)(e.Item.Cells[3].FindControl("cbSex"))).Checked?"1":"0";
string strBirthday =((TextBox)(e.Item.Cells[4].Controls[0])).Text;
string strEmail =((TextBox)(e.Item.Cells[5].Controls[0])).Text;
string strSql = "update tbStudentinfo set StudentName='"+strName+"',StudentPass='"+strPass+"'";
strSql +=",Sex="+strSex+",Birthday='"+strBirthday+"',Email='"+strEmail+"' where studentid="+strStudentID+"";
ExecuteSql(strSql);
dgShow.EditItemIndex = -1;
BindData();
}
*DataGrid其他使用技巧
.如何用程序隐藏和显示DataGrid中的一列
dgShow.Columns[0].Visible = false;
.如何控制datagrid里编辑功能出现的TextBox的宽度？
在DataGrid_ItemDataBound(...)事件中写代码
例如
private void dgShow_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.EditItem)
{
for (int i=0;i<e.Item.Cells.Count;i++)
{
if(e.Item.Cells[i].Controls.Count>0)
{
try
{
TextBox t =(TextBox)e.Item.Cells[i].Controls[0];
t.Width=130;
}
catch(Exception ee)
{}
}
}
}
}
.datagrid只显示dataset中多列数据中的一列
DataGrid的AutoGenerateColumns属性设为False，自己加绑定列。
.DataGrid 中的数据导出到 Microsoft Excel
private void BindData()
{
string strCon = System.Configuration.ConfigurationSettings.AppSettings["DSN"];
SqlConnection con = new SqlConnection(strCon);
SqlDataAdapter da = new SqlDataAdapter("Select * from tbStudentinfo",con);
DataSet ds = new DataSet();
da.Fill(ds,"studentinfo");
dgShow.DataSource = ds.Tables["studentinfo"].DefaultView;
dgShow.DataBind();
}
#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
//
// CODEGEN：该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
}
#endregion
protected void btnMIME_Click(object sender, System.EventArgs e)
{
Response.ContentType = "application/vnd.ms-excel";
Response.Charset = "";
this.EnableViewState = false;
System.IO.StringWriter sw = new System.IO.StringWriter();
System.Web.UI.HtmlTextWriter hw = new System.Web.UI.HtmlTextWriter(sw);
int nCur = dgShow.CurrentPageIndex;
int nSize = dgShow.PageSize;
dgShow.AllowPaging = false;
BindData();
dgShow.Columns[7].Visible =false;
dgShow.RenderControl(hw);
dgShow.Columns[7].Visible =true;
//以下恢复分页
dgShow.AllowPaging = true;
dgShow.CurrentPageIndex = nCur;
dgShow.PageSize = nSize;
BindData();
Response.Write(sw.ToString());
Response.End();
}
