ASP.NET 3.5中的ListView控件和DataPager控件（二）

在ListView中添加和编辑数据
ListView通过EditItemTemplate和InsertItemTemplate来提供编辑数据和添加数据的功能。这个功能的使用非常类似于GridView的编辑特性的使用，只不过它用的都是自定义模板。

<asp:ListView ID="lvItems" runat="server" 
              DataSourceID="Data" 
              ItemContainerID="layoutTemplate" 
              DataKeyNames="Pk"
              InsertItemPosition="None"               
>

    <Layouttemplate>                
        <div id="layoutTemplate" runat="server" />                        
    </Layouttemplate>        
        
    <ItemTemplate>
        <div class="itemdisplay">
        <b><% # Eval("Sku") %></b><br />
        <% # Eval("Abstract") %></div>
        
        <asp:Button ID="Button1" runat="server" CommandName="Edit" Text="Edit" />
        <asp:Button ID="Button2" runat="server" CommandName="Delete" Text="Delete" />
    </ItemTemplate>
    <AlternatingItemTemplate >
        <div class="itemdisplayalternate">
        <b><% # Eval("Sku") %></b><br />
        <% # Eval("Abstract") %></div>
        <asp:Button ID="Button1" runat="server" CommandName="Edit" Text="Edit" />
        <asp:Button ID="Button2" runat="server" CommandName="Delete" Text="Delete" />
    </AlternatingItemTemplate>
    <EditItemTemplate>
        <div class="gridalternate">
        Sku: <asp:TextBox runat="server" ID="txtSku" Text='<%# Bind("Sku") %>'></asp:TextBox>
        <br />
        Abstract: <asp:TextBox  runat="server" id="txtAbstract" Text='<%# Bind("Abstract") %>'></asp:TextBox>
        <br />
        <asp:Button ID="Button3" runat="server" CommandName="Update" Text="Update" />
        <asp:Button ID="Button4" runat="server"
                    CommandName="Cancel" Text="Cancel" /><br />
         </div>
    </EditItemTemplate>
    <InsertItemTemplate>
        <div style="background:Yellow">
        <asp:TextBox runat="server" ID="txtSku" Text='<%# Bind("Sku") %>'></asp:TextBox>
        <br />
        <asp:TextBox  runat="server" id="txtAbstract" Text='<%# Bind("Abstract") %>'></asp:TextBox>
        <br />
        </div>
        <asp:Button ID="Button3" runat="server" CommandName="Inser" Text="Insert" />
        <asp:Button ID="Button4" runat="server"
                    CommandName="Cancel" Text="Cancel" /><br />
    </InsertItemTemplate>            
</asp:ListView>

在本例中我使用的是SqlDataSource（我比较懒），SqlDataSource中的Insert和Update语句是你必须要提供的。 InsertItemTemplate是ListView中新增的非常受欢迎的模板，我们可以把它的UI设置成与编辑模板相一致。我们还可以通过InsertItemPosition属性来指定插入模板的位置，它可以是FirstItem、LastItem或None。一般来说，应该把它设置为None，然后通过某个按钮来设置插入模板的显示位置（FirstItem或LastItem）。示例代码如下：

protected void btnAddItem_Click(object sender, EventArgs e)
{
    this.lvItems.InsertItemPosition = InsertItemPosition.FirstItem;
}

protected void lvItems_ItemCommand(object sender, ListViewCommandEventArgs e)
{
    if (e.CommandName == "Update")
     {
        TextBox tb = e.Item.FindControl("txtSku") as TextBox;
        this.lvItems.InsertItemPosition = InsertItemPosition.None;
        Response.Write(tb.Text);
    }
    if (e.CommandName == "Cancel")
     {
        this.lvItems.InsertItemPosition = InsertItemPosition.None;
    }   
    
}

你可以在OnItemCommand中写上自己的逻辑，使得一旦执行了Update或Cancel命令就设置InsertItemPosition为None。


分组
大概介绍一下，最后生成的HTML代码会先用GroupTemplate分组，然后再以LayoutTemplate做容器包裹起来。

    <Layouttemplate>                
        <div id="groupContainer" runat="server" >                                
        </div>
    </Layouttemplate> 
    <GroupTemplate>        
        <div class="blockheader" style="height:23px;padding:7px">Group Header:</div>
        <div id="layoutTemplate" runat="server" />                        
    </GroupTemplate> 

你可以设置ListView的GroupItemCount属性，来指定每组显示多少条记录。


总结
ListView 是ASP.NET中新增的一个非常酷的控件。 在本文中我已经介绍过了，相对于GridView来说它有着更为丰富的布局手段，你可以在它的模板内写任何HTML标记或者控件。如果你使用过Repeater和GridView的话，那么你将会轻松的上手ListView，不过很明显地，你也将要手写更多的HTML标记。 但是，它也将会给我们带来更多的布局上的自由度，同时也具有编辑、插入等特性。这就是ASP.NET 3.5给我们带来的非常棒的控件。