ASP.NET服务器控件

 

ListView与DataPager控件

ListView控件与GridView很大的区别是,ListView控件的数据完全是由模板来显示,开发人员可以自定义模板来灵活的显示数据。这些模板有:

LayoutTemplate(数据就是在这里显示的,不过真正用来显示数据的是ItemTemplate模板,只不过ItemTemplate模板在这里占了一个位置而已,所以LayoutTemplate里是放table还是div都是一样的,另外在分组布局时,在LayoutTemplate里占位的是GroupTemplate模板,但在GroupTemplate模板里占位的是ItemTemplate模板,所以终究是ItemTemplate模板显示数据)

ItemTemplate(显示绑定的数据的模板)

GroupTemplate(分组模板)

EmptyItemTemplate(当用GroupTemplate模板分组后,在有些行内的ItemTemplate模板不够GoupItemCount属性定的个数(每行的ItemTemplate数),将显示EmptyItemTemplate的内容)

ItemSeparatorTemplate(各项之间显示的内容)

EmptyDataTemplate(当数据源为返回数据时显示的内容)

SelectedItemTemplate(所选数据项显示的内容)

AlternatingItemTemplate(交替项所显示的内容)

EditItemTemplate(编辑项所显示的内容,会由EditItemTemplate取代ItemTemplate)

InsertItemTemplate(插入项)

当为ListView绑定了数据源后,它不会自动生成呈现的代码:

 <asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1">

    </asp:ListView>

这时在智能列表里会有一个配置ListView的选项,可以选择布局及样式,如果在数据源配置时配置了增删改,在这里就可以启用增删改及分页选项，这些布局分别是:

网格式(与GridView显示差不多,用table布局),还有平铺式(用到了GoupTemplate来分组,用table布局),项目符号列表(ul列表),流(与ul差不多,用div布局),单行(与平铺差不多,用table布局)

当然也可以自己手工来布局自己想要的，但在这之前必须要明确:1.runat="server" 2.必定有一个暂且叫容器元素或控件的ID="itemPlaceholder",如: 

<tr ID="itemPlaceholder" runat="server"></tr>,<li ID="itemPlaceholder" runat="server" />,<asp:PlaceHolder ID="itemPlaceHolder" runat="server"></asp:PlaceHolder>这些ID表明他们是itemTemplate模板的占位符。当然用到GoupTemplate分组时这些ID可以写成groupPlaceHolder,但在GroupTemplate里的占位符ID必需是itemPlaceholder。当通过ListView的GroupItemCount分组布局时,对于在智能列表里配置的ListView:网格式,项目符号列表,流,单行(分不了组,其没有GroupTemplate模板)平铺式(有GroupTemplate模板,可以分组),自己动手加GroupTemplate模板比较麻烦。对于自己手工布局的ListView只要有GroupTemplate模板就可以完成分组。

ListVist本身没有分页功能,要靠DataPager来辅助分页,DataPager只要放在实现了IPageableItemContainer接口的控件中将自动完成分页功能。对于在智能列表里配置的ListView,只要启动了分页,在代码里就自动加入了DataPager控件,只要给它加上PageSize属性(每页显示几条记录)就可以了。对于自己手工布局的ListView:把DataPager拖到其LayoutTemplate模板里,还可在其智能任务列表里设置分页的样式。

手工布局的ListView:

<asp:ListView ID="ListView6" runat="server" DataSourceID="SqlDataSource1" 

                 GroupItemCount="2">

        <LayoutTemplate>

        <fieldset runat="server">

        <legend runat="server">评论</legend>

        <asp:PlaceHolder ID="groupPlaceHolder" runat="server"></asp:PlaceHolder>

        </fieldset>

        <asp:DataPager ID="DataPager2" runat="server" PageSize="2">

        <Fields>

        <asp:NextPreviousPagerField ButtonType="Button" ShowFirstPageButton="True" 

                                 ShowLastPageButton="True" />

        </Fields>

        </asp:DataPager>

        </LayoutTemplate>

        <GroupTemplate>

        <div runat="server" class="group" id="group">

        <asp:PlaceHolder ID="itemPlaceHolder" runat="server"></asp:PlaceHolder>

        </div>

        </GroupTemplate>

        <ItemTemplate>

        <div runat="server" id="item" class="item">

        <h3>评论ID:<%#Eval("id")%></h3>

        评论时间:<%#Eval("createtime","{0:d}") %><br />

        评论内容:<%#Eval("content") %><br />

        </div>

        </ItemTemplate>

        <SelectedItemTemplate>

        <div runat="server" id="item" class="item">

        <h3>评论ID:<%#Eval("id")%></h3>

        评论时间:<%#Eval("createtime","{0:d}") %><br />

        评论内容:<%#Eval("content") %><br />

        </div>

        </SelectedItemTemplate>

    </asp:ListView>

 <style type="text/css">

    .group{ background-color:Gray; border-style:dashed; border-color:Red; border-width:2px;}

    .item { background-color:Yellow; border-style:dotted; border-color:Green; border-width:2px; color:Blue;}

     .item h3{ font-family:微软雅黑; color:Green; height:20px; margin-top:0px; margin-bottom:0px;}

    </style>