GridView分页 - 第一个，最后一个，下一个，上一个

Question

是否可以添加：

GridView分页的“First，Last，Next，Previous”选项？ 我似乎无法弄明白。 我能得到的只是数字和>>为最后和<<为第一...

Answer 1

设置PagerSettings部分的PageText属性的值：

<asp:GridView ID="gridView" runat="server" AllowPaging="True">
    <PagerSettings  Mode="NextPreviousFirstLast" FirstPageText="First" PreviousPageText="Previous" NextPageText="Next" LastPageText="Last" />
</asp:GridView>

您也可以在设计器的“属性”窗口中设置这些值。

Answer 2

GridView的默认Pager不灵活。

替代方案是这些

1. 使用GridView的Pager模板（ MSDN的GridView PagerTemplate属性 ）
2. 扩展GridView控件以支持DataPager（ 此处示例 ）

Answer 3

是的，可以使用gridview的PagerSettings属性，您需要做的就是将PagerSetting的模式设置为'NextPreviousFirstLast'，这样您就可以使用“First，Last，Next，Previous”选项进行gridview分页。

  <PagerSettings  Mode="NextPreviousFirstLast" FirstPageText="First" PreviousPageText="Previous" NextPageText="Next" LastPageText="Last" />

模式的另外三个属性如“NextPrevious”，“Numeric”和“NumericFirstLast”

使用它们..

NextPrevious：

 <PagerSettings Mode="NextPrevious" PreviousPageText="Previous" NextPageText="Next"/>

数字：

  <PagerSettings  Mode="Numeric" />

NumericFistLast：

      <PagerSettings  Mode="NumericFistLast" />

Answer 4

在这里输入图像描述我们还可以在gridview中组合数字和第一个和最后一个自定义按钮为此，我们需要在gridview中启用常规分页
然后设置pagerstyle这将显示带有数字的正常分页。 对于自定义的第一个和最后一个按钮，为此编写jquery代码

$（document）.ready（function（）{//对于寻呼机第一个位置的第一个按钮，使用前置方法$（'。gridviewPager'）。nearest（'tr'）。find（'table tbody tr'）。prepend （'First'）; //对于寻呼机最后位置的Last按钮，使用追加方法$（'。gridviewPager'）。nearest（“tr”）。find（“table tbody tr”）。append（'Last'） ;}）

带第一个和最后一个按钮的寻呼机

  <script type="text/javascript"> $(document).ready(function () { $('.gridviewPager').closest('tr').find('table tbody tr').prepend('<td><a href="javascript:__doPostBack(' + "'ctl00$ContentPlaceHolder1$gvReport'" + ',' + "'Page$First'" + ')">First</a></td>'); $('.gridviewPager').closest("tr").find("table tbody tr").append('<td><a href="javascript:__doPostBack(' + "'ctl00$ContentPlaceHolder1$gvReport'" + ',' + "'Page$Last'" + ')">Last</a></td>'); }) </script> 

  <style> .gridviewPager { background-color: #fff; padding: 2px; margin: 2% auto; } .gridviewPager a { margin: auto 1%; border-radius: 50%; background-color: #545454; padding: 5px 10px 5px 10px; color: #fff; text-decoration: none; -o-box-shadow: 1px 1px 1px #111; -moz-box-shadow: 1px 1px 1px #111; -webkit-box-shadow: 1px 1px 1px #111; box-shadow: 1px 1px 1px #111; } .gridviewPager a:hover { background-color: #337ab7; color: #fff; } .gridviewPager span { background-color: #066091; color: #fff; -o-box-shadow: 1px 1px 1px #111; -moz-box-shadow: 1px 1px 1px #111; -webkit-box-shadow: 1px 1px 1px #111; box-shadow: 1px 1px 1px #111; border-radius: 50%; padding: 5px 10px 5px 10px; } </style> 

  <asp:GridView ID="gvReport" runat="server" DataKeyNames="ID" class="table table-striped table-bordered" AllowPaging="true" PageSize="10" Width="100%" AutoGenerateColumns="false"> <PagerStyle CssClass="gridviewPager" /> <Columns> <asp:TemplateField HeaderText="Sr No"> <ItemTemplate> <asp:Label ID="lblSrNo" runat="server" Text='<%#Container.DataItemIndex+1 %>'></asp:Label> </ItemTemplate> </asp:TemplateField> <asp:BoundField DataField="ID" HeaderText="Id" Visible="false"></asp:BoundField> <asp:BoundField DataField="NameE" HeaderText="Aadhar Name"></asp:BoundField> <asp:BoundField DataField="District" HeaderText="District Name"></asp:BoundField> <asp:BoundField DataField="Block" HeaderText="Block Name"></asp:BoundField> <asp:BoundField DataField="Mobile" HeaderText="Mobile"></asp:BoundField> <asp:BoundField DataField="AMobile" HeaderText="Alternate Mobile"></asp:BoundField> <asp:BoundField DataField="Adhar" HeaderText="Adhar"></asp:BoundField> <asp:BoundField DataField="Gender" HeaderText="Gender"></asp:BoundField> <asp:BoundField DataField="Sector" HeaderText="Sector's"></asp:BoundField> <asp:BoundField DataField="Age" HeaderText="Age"></asp:BoundField> <asp:BoundField DataField="Qualification" HeaderText="Highest Qualification"></asp:BoundField> <asp:BoundField DataField="GREDTYPE" HeaderText="Score Type"></asp:BoundField> <asp:BoundField DataField="PGC" HeaderText="Per./Grade/CGPA"></asp:BoundField> </Columns> </asp:GridView>