GridView的介绍

   应用:

       使用GridView来显示数据库中表的数据,如图:有一个T_User表

      

       用GridView显示的效果是:(其实和数据库中的显示效果是一样一样的。)

      

       当然还可以在此基础上进行修改。如启用编辑、删除、修改等功能。我不显示User_Id字段了等都是可以的。

  

      操作过程:

方法1:在【服务器资源管理器】中添加上数据库的连接,找到要显示的表,将要显示的字段选中,直接拖动到页面就可以了。(微软nm就是智能),这个应用在测试过程中,很是实用。但在正规的项目中并不推荐。

方法2:当然你也可以先拖动一个GridView,然后再拖动一个SqlDataSource,效果都是一样一样的。

方法3:更过通常的做法,我们是GridView+ObjectDataSource+DataSet来实现这个功能(推荐)。

     更改表头成汉字

在【源】中打到HeaderText,修改即可:

 

你还可以设置DataFormatString="{0:C2}"来将数字以美元形式来显示

    给每一行添加一个按钮,当点击的时候,将所在的Id添加到一个ListBox列表中

在GridView的Columns中添加

            <asp:ButtonField ButtonType="Button" Text="添加" CommandName="add" />
            <asp:ButtonField ButtonType="Button" Text="取消" CommandName="cancel" />

这样就添加了两个按钮,这里的CommandName的值自己随便起。

       然后在GirdView的RowCommand事件中添加如下代码:

protected void GridView2_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            int index = Convert.ToInt32(e.CommandArgument);
            string id = GridView2.Rows[index].Cells[0].Text;
            if (e.CommandName == "add")
            {
                listBoxMsg.Items.Add(id);
            }
            else if (e.CommandName == "cancel")
            {
                while (listBoxMsg.Items.Contains(new ListItem(id)))
                {
                    listBoxMsg.Items.RemoveAt(listBoxMsg.Items.IndexOf(new ListItem(id)));
                }
            }
            else
            {
                return;
            }           
        }

 

    添加一个字段,明细字段,当点击的时候,就转到了另一个页面,并把Id传过去

在GridView的Columns中添加

 <asp:HyperLinkField DataTextField="User_Name" DataTextFormatString="查看{0}明细"
   DataNavigateUrlFields="User_Id" DataNavigateUrlFormatString="Details.aspx?id={0}" />

    我想让Id字段以按钮的形式显示,这就用到了自定义模板(这个就很像ListView控件了)

把原来的User_Id的BoundField去掉

 <asp:TemplateField  HeaderText="User_Id"  InsertVisible="False" SortExpression="User_Id">
          <EditItemTemplate>
               <asp:Label ID="Label1" runat="server" Text='<%# Bind("User_Id") %>'></asp:Label>
         </EditItemTemplate>
         <ItemTemplate>
               <asp:Button ID="Button1" runat="server" Text='<%# Bind("User_Id") %>' />
         </ItemTemplate>
  </asp:TemplateField>

   我想实现高亮显示,鼠标放在哪一行,哪一行高亮显示

添加

<RowStyle CssClass="shenRow" /> 

这个与Columns同级,剩下的就是js与css的知识了。

<style type="text/css">
        .light
        {
           background-color:Yellow;
        }
    </style>
    <script src="../Styles/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $(".shenRow").mouseenter(function () {
                $(this).addClass("light");
            }).mouseleave(function () {
                $(this).removeClass("light");
            });
        });
    </script>

 

 

 

posted on 2013-06-08 17:45  dianyitongxiao  阅读(188)  评论(0编辑  收藏  举报