Question

我在我的web项目中使用ListView和DataPager进行分页。它工作正常，但生成的分页HTML只是一个包含一些超链接的范围。

我想自定义HTML并在无序列表中显示链接（ul）。

有人知道如何做到这一点？我能想到的一种方法是CSSFriendly适配器，但如果有更简单的方法，我不想这样做。

编辑：有人可以帮我解决在模板中创建控件所需的确切步骤吗？很抱歉愚蠢，但我无法想象这部分，尽管有广泛的谷歌搜索。

Answer 1

您可以使用PagerTemplate指定您要用于分页控件的标记。我不确定你在显示分页信息方面正在尝试做什么，如ul / li，但这应该足以让你在正确的轨道上开始。很抱歉代码长跑到一边......

例如：

<asp:DataPager ID="DataPager1" runat="server" PagedControlID="gridInvoiceHistory"
            PageSize="20">
            <Fields>
                <asp:TemplatePagerField>
                    <PagerTemplate>
                        Page
                        <asp:Label runat="server" ID="labelCurrentPage" Text="<%# Container.TotalRowCount > 0 ? (Container.StartRowIndex / Container.PageSize) + 1 : 0 %>" />
                        of
                        <asp:Label runat="server" ID="labelTotalPages" Text="<%#  Math.Ceiling ((double)Container.TotalRowCount / Container.PageSize) %>" />
                    </PagerTemplate>
                </asp:TemplatePagerField>

编辑：这是一个更详细的解决方案：

<asp:TemplatePagerField>
     <PagerTemplate>
          <asp:BulletedList ID="listPages" runat="server" 
               DisplayMode="LinkButton" onclick="listPages_Click">
          </asp:BulletedList> 
     </PagerTemplate>
</asp:TemplatePagerField>

以下是代码隐藏中的内容：

protected void listPages_Click(object sender, BulletedListEventArgs e)
        {
            var pageNo = int.Parse((sender as BulletedList).Items[e.Index].Text);
            var startIndex = (pageNo - 1) * DataPager1.PageSize;
            DataPager1.SetPageProperties(startIndex, DataPager1.PageSize, true);
        }

您还需要做的是针对获取页面计数的方法对项目符号列表执行数据绑定，并返回页面链接所需文本的IEnumerable列表。标准警告：这是示例代码，如果没有彻底的审查，可能不应该在生产环境中使用！：）

Answer 2

使用jQuery或JavaScript：数据路径器在它们之间呈现 的链接，因此获取渲染的html并将其拆分为 ，然后创建ul并将项目附加为li。

 $(function() {
        var pagerControl = <%= "'#" & DataPager1.ClientId & "';" %>
        $(pagerControl).hide(); 
         var items = $(pagerControl).html().split('&nbsp;');
         $.each(items, function(index, value) { if (value.length > 0)$('#pagination').append('<li>' + value + '</li>'); });
    });

自定义ASP.Net DataPager生成的HTML

2 个答案: