6

我在我的 Web 项目中使用 ListView 和 DataPager 进行分页。它工作正常,但为分页生成的 HTML 只是一个包含一些超链接的跨度。

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

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

编辑:有人可以帮我完成在模板中创建控件所需的确切步骤吗?对不起,我很愚蠢,但我无法弄清楚这部分,尽管谷歌搜索很广泛。

4

2 回答 2

9

您可以使用 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 列表的方法对项目符号列表执行数据绑定。标准警告:这是示例代码,未经彻底审查可能不应该在生产环境中使用!:)

于 2009-06-12T16:16:29.560 回答
1

使用 jQuery 或 JavaScript:datapager 渲染&nbsp;它们之间的链接,因此获取渲染的 html 并将其拆分,&nbsp;然后创建您的 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>'); });
    });
于 2010-12-02T19:58:06.647 回答