c# - 格式化 asp :DataPager to show in ul li

Question

我正在使用 Twitter Bootstrap 和 ASP.Net C# Webforms 构建网站。我的页面上有一个绑定(bind)了 DataPager 的 ListView，但我需要更改 .Net 呈现 DataPager 的 HTML 的方式。

目前，所有寻呼机项目都是这样显示的:

<div class="clearfix pagination pagination-centered"> <span id="cpBody_dpListing"> <a class="aspNetDisabled">First</a>&nbsp;<span>1</span>&nbsp; <a href="javascript:__doPostBack('ctl00$cpBody$dpListing$ctl02$ctl01','')">2</a>&nbsp; <a href="javascript:__doPostBack('ctl00$cpBody$dpListing$ctl03$ctl00','')">Last</a>&nbsp; </span> </div>

但是我需要将所有项目包装在无序列表中，而不是 span 和标签。我当前的标记如下所示:

<div class="clearfix pagination pagination-centered">
<asp:DataPager ID="dpListing" runat="server" PagedControlID="lvListing" PageSize="10" OnPreRender="dpListing_PreRender">
    <Fields>
        <asp:TemplatePagerField>
            <PagerTemplate>
                <asp:BulletedList ID="listPages" runat="server" DisplayMode="LinkButton" OnClick="listPages_Click"></asp:BulletedList>
            </PagerTemplate>
        </asp:TemplatePagerField>
        <asp:NextPreviousPagerField ButtonType="Link" ShowFirstPageButton="true" ShowNextPageButton="false" ShowPreviousPageButton="false" />
        <asp:NumericPagerField PreviousPageText="&lt; Prev 10" NextPageText="Next 10 &gt;" ButtonCount="10" />
        <asp:NextPreviousPagerField ButtonType="Link" ShowLastPageButton="true" ShowNextPageButton="false" ShowPreviousPageButton="false" />
    </Fields>
</asp:DataPager>

我需要以某种方式覆盖 NextPreviousPagerField 和 NumericPagerField，以便它们输出

标签而不是 和 。

Answer 1

DataPager不支持开箱即用，因此您将需要一个自定义控件。幸运的是，实现起来非常容易!

对于每个 DataPagerField , DataPager添加 DataPagerFieldItem控件到它自己的控件集合，然后告诉该字段在该项目中创建它的控件。内置字段将在按钮之间添加不间断空格(除非您将 RenderNonBreakingSpacesBetweenControls 属性设置为 false )，但它们很容易识别和抑制。

此控件仍将呈现 <a>已启用按钮的标签和 <span>当前页码的标记，但应该接近您需要的:

public class UnorderedListDataPager : DataPager
{
   protected override HtmlTextWriterTag TagKey 
   {
      get { return HtmlTextWriterTag.Ul; }
   }

   protected override void RenderContents(HtmlTextWriter writer)
   {
      if (HasControls())
      {
         foreach (Control child in Controls)
         {
            var item = child as DataPagerFieldItem;
            if (item == null || !item.HasControls())
            {
                child.RenderControl(writer);
                continue;
            }

            foreach (Control button in item.Controls)
            {
               var space = button as LiteralControl;
               if (space != null && space.Text == " ") continue;

               writer.RenderBeginTag(HtmlTextWriterTag.Li);
               button.RenderControl(writer);
               writer.RenderEndTag();
            }
         }
      }
   }
}

HTML 输出:

<ul id="dpListing">
   <li><a class="aspNetDisabled">First</a></li>
   <li><span>1</span></li>
   <li><a href="javascript:__doPostBack('ctl00$cpBody$dpListing$ctl02$ctl01','')">2</a></li>
   <li><a href="javascript:__doPostBack('ctl00$cpBody$dpListing$ctl03$ctl00','')">Last</a></li>
</ul>