.net之 datagrid

　　(自己参加的这个项目中)数据绑定控件除了上节的repeater,另一个常用的就是datagrid了.预实现效果:

 

 一:用到的几个属性,概述.

(1)AutoGenerateColumns(是否自动生成列):默认情况下,属性被设置为 true,为数据源中的每一个字段创建一个列(BoundColumn)对象.列显示顺序与每一字段在数据源中出现的顺序一样。 通常情况下,将其设为false,而只选择你要显示的列,将其包含在<columns></columns>标记之间列,显示顺序与添加顺序一致。

(2)AlternatingItemStyle(交替项样式) :指定 控件中交替项的样式,为了美观,常把相邻两行定义为不同的样式.

(3)ItemStyle(项样式):指定控件中项的样式。

(4)HeaderStyle(头样式): 指定控件中页眉部分的样式。

(5)PagerStyle:指定控件中页选择部分的样式,可用于对所绑定数据分页,

(6)Columns:列集合,当自动生成列设为false时,添加自定义列.

(7)BoundColumn:显示绑定到数据源中的字段的列。它以文本形式显示字段中的每个项。这是 DataGrid 控件的默认列类型。

(8)TemplateColumn:按照指定的模板显示列中的各项。这使您可以在列中提供自定义控件。

(9)DataField:指定所绑定数据源对应的列名称

(10)HeaderText:指定头部显示名称

(11)Wrap:是否换行

(12)HorizontalAlign:水平停靠位置

二:datagrid用到的事件概述:

(1)先调用ItemCreated创建每一项,然后调用ItemDataBound绑定每一项数据,当点击一行时会调用Itemcommand事件.

所以若要对每一行中的空间添加属性,则应在ItemCreated中,若与所绑定的数据有关则在ItemDataBound中,为每一行的某些项添加CommandName则可以再ItemCommand中获取对应事件.

代码如下:

.aspx中代码:

                <asp:datagrid id="DGItem" runat="server" Width="100%" PageSize="40" AutoGenerateColumns="False"
                            CssClass="DataGrid" AllowPaging="True">
                            <AlternatingItemStyle CssClass="DataGridAlter"></AlternatingItemStyle>
                            <ItemStyle CssClass="DataGridItem"></ItemStyle>
                            <HeaderStyle Wrap="False" CssClass="DataGridHeader"></HeaderStyle>
                            <PagerStyle Visible="False"></PagerStyle>
                            <Columns>
                                <asp:BoundColumn Visible="False" DataField="newsId" HeaderText="newsId">
                                    <HeaderStyle Wrap="False"></HeaderStyle>
                                </asp:BoundColumn>
                                <asp:TemplateColumn HeaderText="选择">
                                    <HeaderStyle Wrap="False" HorizontalAlign="Center" Width="50px" VerticalAlign="Middle"></HeaderStyle>
                                    <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle"></ItemStyle>
                                    <HeaderTemplate>
                                        <asp:checkbox id="chkAll" runat="server" Text="删除"></asp:checkbox>
                                    </HeaderTemplate>
                                    <ItemTemplate>
                                        <asp:checkbox id="chkSingle" runat="server"></asp:checkbox>
                                    </ItemTemplate>
                                </asp:TemplateColumn>
                                <asp:BoundColumn DataField="newsTitle" HeaderText="名称">
                                    <HeaderStyle Wrap="False"></HeaderStyle>
                                </asp:BoundColumn>
                                <asp:BoundColumn DataField="keywords" HeaderText="关键字">
                                    <HeaderStyle Wrap="False"></HeaderStyle>
                                </asp:BoundColumn>
                                <asp:TemplateColumn HeaderText="来源">
                                    <ItemTemplate>
                                        <asp:Label id="Label1" runat="server" Text="dd"></asp:Label>
                                    </ItemTemplate>
                                </asp:TemplateColumn>
                                <asp:BoundColumn DataField="inDate" HeaderText="添加日期" DataFormatString="{0:yyyy-MM-dd}">
                                    <HeaderStyle Wrap="False" Width="70px"></HeaderStyle>
                                    <ItemStyle HorizontalAlign="Center"></ItemStyle>
                                </asp:BoundColumn>
                                <asp:BoundColumn DataField="editDate" HeaderText="修改日期" DataFormatString="{0:yyyy-MM-dd}">
                                    <HeaderStyle Wrap="False" Width="70px"></HeaderStyle>
                                    <ItemStyle HorizontalAlign="Center"></ItemStyle>
                                </asp:BoundColumn>
                                <asp:BoundColumn DataField="hits" HeaderText="点击率">
                                    <HeaderStyle Wrap="False" Width="40px"></HeaderStyle>
                                    <ItemStyle Wrap="False" HorizontalAlign="Center"></ItemStyle>
                                </asp:BoundColumn>
                                <asp:BoundColumn DataField="orderNo" HeaderText="序号">
                                    <HeaderStyle Wrap="False" Width="40px"></HeaderStyle>
                                    <ItemStyle Wrap="False" HorizontalAlign="Center"></ItemStyle>
                                </asp:BoundColumn>
                                <asp:TemplateColumn HeaderText="审核">
                                    <HeaderStyle Wrap="False" Width="55px"></HeaderStyle>
                                    <ItemStyle HorizontalAlign="Center"></ItemStyle>
                                    <ItemTemplate>
                                        <asp:CheckBox id=cbIsPass runat="server" Text="通过" OnCheckedChanged="CheckBox_CheckedChanged" AutoPostBack="True" Checked='<%# DataBinder.Eval(Container, "DataItem.isPass") %>' >
                                        </asp:CheckBox>
                                    </ItemTemplate>
                                </asp:TemplateColumn>
                                <asp:TemplateColumn HeaderText="设置">
                                    <HeaderStyle Wrap="False" Width="120px"></HeaderStyle>
                                    <ItemStyle HorizontalAlign="Center"></ItemStyle>
                                    <ItemTemplate>
                                        <cc1:userlinkbutton id="btnCommand" runat="server" ToolTip="推荐本新闻" CommandName="command">[我要推荐]</cc1:userlinkbutton>&nbsp;&nbsp;
                                        <cc1:userlinkbutton id="btnRemark" runat="server" ToolTip="管理评论" CommandName="remark">[评论]</cc1:userlinkbutton>&nbsp;&nbsp;
                                        <cc1:userimagebutton id="imgButtonEdit" runat="server" ToolTip="修改" CommandName="Edit" ImageAlign="AbsMiddle"
                                            ImageUrl="../Images/edit.gif"></cc1:userimagebutton>
                                    </ItemTemplate>
                                </asp:TemplateColumn>
                                <asp:BoundColumn Visible="False" DataField="isPic" HeaderText="isPic"></asp:BoundColumn>
                                <asp:BoundColumn Visible="False" DataField="picUrl" HeaderText="picUrl"></asp:BoundColumn>
                                <asp:BoundColumn Visible="False" DataField="isCommand" HeaderText="isCommand"></asp:BoundColumn>
                            </Columns>
                        </asp:datagrid>

aspx.cs中代码:

在ItemCreated中为每一行的checkbox添加点击事件(调用js)

        /// <summary>
        /// 创建datagrid时,,为checkbox添加js事件
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void DGItem_ItemCreated(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
        {
            if(e.Item.ItemType == ListItemType.Header)
            {
                ((CheckBox)e.Item.Cells[1].FindControl("chkAll")).Attributes.Add("onclick","CheckAll('" + this.DGItem.ClientID.ToString() + "','chkAll','chkSingle');");
            }    
            if(e.Item.ItemType == ListItemType.AlternatingItem || e.Item.ItemType == ListItemType.Item)
            {
                ((CheckBox)e.Item.Cells[1].FindControl("chkSingle")).Attributes.Add("onclick","CheckSingle('" + this.DGItem.ClientID.ToString() + "','chkAll','chkSingle');");
            }
            
        }

在ItemDataBound中为需要根据数据源显示的项进行判断(如若对应新闻项目已推荐,则显示取消推荐,否则显示我要推荐)

        /// <summary>
        /// 绑定数据时调用事件,设置是否推荐
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void DGItem_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
        {
            if(e.Item.ItemType == ListItemType.AlternatingItem || e.Item.ItemType == ListItemType.Item)
            {
                bool command = System.Boolean.Parse(e.Item.Cells[13].Text.ToString());
                if(command)
                {
                    ((LinkButton) e.Item.FindControl("btnCommand")).Text="[取消推荐]";
                }
                else
                {
                    ((LinkButton) e.Item.FindControl("btnCommand")).Text="[我要推荐]" ;
                }
            }
        }

根据aspx中设置的CommanName在ItemCommand事件中判断下一步的操作(推荐,评论还是修改?)

        /// <summary>
        /// 检测(评论,推荐,编辑事件 )
        /// </summary>
        /// <param name="source"></param>
        /// <param name="e"></param>
        private void DGItem_ItemCommand(object source, System.Web.UI.WebControls.DataGridCommandEventArgs e)
        {
            e.Item.Cells[0].Text.ToString();
            //this.Response.Write(e.CommandArgument+" name: "+e.CommandName+ e.Item.Cells[0].Text.ToString());    
            string command =""+ e.CommandName;
            string strId = ""+ e.Item.Cells[0].Text.ToString();
            int newsId =System.Int32.Parse(strId);
            tNewsFac = new DevSec.DH.Ums.DH.Fac.DCtNews();
            if(command.Equals("command"))
            {
                string str =((LinkButton) e.Item.FindControl("btnCommand")).Text.ToString() ;
                if(str.Equals("[我要推荐]"))
                {
                
                    //如果设为推荐
                    tNewsFac.SetCommand(newsId,1);
                    ((LinkButton) e.Item.FindControl("btnCommand")).Text="[取消推荐]" ;
                }
                else
                {
                    //取消推荐
                    tNewsFac.SetCommand(newsId,0);
                    ((LinkButton) e.Item.FindControl("btnCommand")).Text="[我要推荐]" ;
                }
            }
            else if(command.Equals("remark"))
            {
                this.Response.Redirect("remark.aspx?newsId="+newsId);
            }
            else if(command.Equals("Edit"))
            {
                this.Response.Redirect("schoolAddEdit.aspx?action=edit&newsId="+newsId);
            }
        }

也可以为datagrid上的checkbox绑定后台事件(如对于通过列)

aspx中为:

                                <asp:TemplateColumn HeaderText="审核">
                                    <HeaderStyle Wrap="False" Width="55px"></HeaderStyle>
                                    <ItemStyle HorizontalAlign="Center"></ItemStyle>
                                    <ItemTemplate>
                                        <asp:CheckBox id=cbIsPass runat="server" Text="通过" OnCheckedChanged="CheckBox_CheckedChanged" AutoPostBack="True" Checked='<%# DataBinder.Eval(Container, "DataItem.isPass") %>' >
                                        </asp:CheckBox>
                                    </ItemTemplate>
                                </asp:TemplateColumn>

.aspx.cs

/// <summary>
        /// 设置是否通过
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        public void CheckBox_CheckedChanged(object sender, System.EventArgs e)
        {
            for(int index=0;index<this.DGItem.Items.Count;index++)
            {
                CheckBox MyCheckBox   =   (CheckBox)DGItem.Items[index].FindControl("cbIsPass");   
                if(sender.Equals(MyCheckBox))
                {
                    int    newsId = System.Int32.Parse(DGItem.Items[index].Cells[0].Text.ToString());
                    tNewsFac = new DevSec.DH.Ums.DH.Fac.DCtNews();
                    tNewsFac.SetPass(newsId);
                }
            }
            //绑定数据
            this.bindData(where);
        }

当然还需要定义该控件,且在页面初次调用时绑定数据源(略)

  protected System.Web.UI.WebControls.DataGrid DGItem; 

    this.DGItem.DataSource = dt;
    this.DGItem.DataBind();       
 其中js代码(实现全选以及单选):

/* 分页
    参数说明：
    prefix：前缀；chkAll：全选框；chkSingle：单选框ID
    
    使用方法：
    if(e.Item.ItemType == ListItemType.Header)
    {
        ((CheckBox)e.Item.Cells[1].FindControl("chkAll")).Attributes.Add("onclick","CheckAll('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle');");
    }
*/
function CheckAll(prefix,chkAll,chkSingle)
{
    var indexChkAll;
    if(prefix.length != 0)
    {
        indexChkAll        = prefix + "__ctl2_" + chkAll;
    }
    else
    {
        indexChkAll        = chkAll;
    }
    var objChkAll = document.getElementById(indexChkAll);
    var tempObj;
    for(var i=0;i<document.forms[0].elements.length;i++)
    {    
        tempObj = document.forms[0].elements[i];
        if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
        {
            tempObj.checked = objChkAll.checked;
        }
    }
}
/* 分页
    参数说明：
    prefix：前缀；chkAll：全选框；chkSingle：单选框ID
    
    使用方法：
    if(e.Item.ItemType == ListItemType.AlternatingItem || e.Item.ItemType == ListItemType.Item)
    {
        ((CheckBox)e.Item.Cells[1].FindControl("chkSingle")).Attributes.Add("onclick","CheckSingle('" + this.dg.ClientID.ToString() + "','chkAll','chkSingle');");
    }
*/
function CheckSingle(prefix,chkAll,chkSingle)
{
    var indexChkAll;
    if(prefix.length != 0)
    {
        indexChkAll        = prefix + "__ctl2_" + chkAll;
    }
    else
    {
        indexChkAll        = chkAll;
    }
    var objChkAll = document.getElementById(indexChkAll);
    var tempObj;
    var allCount    = 0;
    var checkCount    = 0;
    for(var i=0;i<document.forms[0].elements.length;i++)
    {    
        tempObj = document.forms[0].elements[i];
        if(tempObj.type == "checkbox" && tempObj.id != indexChkAll && tempObj.id.indexOf(chkSingle) != -1)
        {
            if(tempObj.checked)
            {
                checkCount++;
            }
            else
            {
                objChkAll.checked = false;
                //break;
            }
            allCount++;
        }
    }
    if(checkCount != allCount)
    {
        objChkAll.checked = false;
    }
    else
    {
        if(allCount != 0)
        {
            objChkAll.checked = true;
        }
    }
}