ASP.NET GridView的Bootstrap分頁樣式
本文實(shí)例為大家分享了GridView的Bootstrap分頁樣式,供大家參考,具體內(nèi)容如下
Revenue.cs收入類,包括實(shí)體模型和業(yè)務(wù)邏輯
public class Revenue
{
public Revenue(string country, string revenue, string salesmanager, string year)
{
this.country = country;
this.revenue = revenue;
this.salesmanager = salesmanager;
this.year = year;
}
public Revenue() { }
public string country { get; set; }
public string revenue { get; set; }
public string salesmanager { get; set; }
public string year { get; set; }
public List<Revenue> GetRevenueDetails(int pagenumber,int maxrecords)
{
List<Revenue> lstRevenue = new List<Revenue>();
string filename = HttpContext.Current.Server.MapPath("~/App_Data/country_revenue.csv");
int startrecord = (pagenumber * maxrecords) - maxrecords;
if (File.Exists(filename))
{
IEnumerable<int> range = Enumerable.Range(startrecord, maxrecords);
IEnumerable<String> lines = getFileLines(filename, range);
foreach (String line in lines)
{
string[] row = line.Split(',');
lstRevenue.Add(new Revenue(row[0], row[1], row[2], row[3]));
}
}
return lstRevenue;
}
public static IEnumerable<String> getFileLines(String path, IEnumerable<int> lineIndices)
{
return File.ReadLines(path).Where((l, i) => lineIndices.Contains(i));
}
public int GetTotalRecordCount()
{
string filename = HttpContext.Current.Server.MapPath("~/App_Data/country_revenue.csv");
int count = 0;
if (File.Exists(filename))
{
string[] data = File.ReadAllLines(filename);
count= data.Length;
}
return count;
}
}
Default.aspx內(nèi)容:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="GridViewBootstrapPagination.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>GridView的Bootstrap分頁樣式</title>
<link href="Styles/bootstrap.min.css" rel="stylesheet" />
<script src="Scripts/jquery-1.8.2.js"></script>
<script src="Scripts/jquery.bootpag.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
// init bootpag
var count = GetTotalPageCount();
$('#page-selection').bootpag(
{
total:count
}).on("page", function (event, num) {
GetGridData(num);
});
});
function GetGridData(num) {
$.ajax({
type: "POST",
url: "Default.aspx/GetRevenueDetail",
data: "{ \"pagenumber\":" + num + "}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
bindGrid(data.d);
},
error: function (xhr, status, err) {
var err = eval("(" + xhr.responseText + ")");
alert(err.Message);
}
});
}
function bindGrid(data) {
$("[id*=gvBSPagination] tr").not(":first").not(":last").remove();
var table1 = $('[id*=gvBSPagination]');
var firstRow = "$('[id*=gvBSPagination] tr:first-child')";
for (var i = 0; i < data.length; i++) {
var rowNew = $("<tr><td></td><td></td><td></td><td></td></tr>");
rowNew.children().eq(0).text(data[i].country);
rowNew.children().eq(1).text(data[i].revenue);
rowNew.children().eq(2).text(data[i].salesmanager);
rowNew.children().eq(3).text(data[i].year);
rowNew.insertBefore($("[id*=gvBSPagination] tr:last-child"));
}
}
function GetTotalPageCount() {
var mytempvar = 0;
$.ajax({
type: "POST",
url: "Default.aspx/GetTotalPageCount",
data: "",
contentType: "application/json; charset=utf-8",
dataType: "json",
async:false,
success: function (data) {
mytempvar=data.d;
},
error: function (xhr, status, err) {
var err = eval("(" + xhr.responseText + ")");
alert(err.Message);
}
});
return mytempvar;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div style="width:670px;margin-left:auto;margin-right:auto;">
<h2 style="text-align:center;">ASP.NET GridView的Bootstrap分頁樣式</h2>
<asp:GridView ID="gvBSPagination" runat="server" CssClass="table table-striped table-bordered table-condensed" Width="660px" AllowPaging="true" PageSize="5" OnPreRender="gvBSPagination_PreRender">
<PagerTemplate>
<div id="page-selection" class="pagination-centered"></div>
</PagerTemplate>
</asp:GridView>
<div id="content"></div>
</div>
</form>
</body>
</html>
后臺代碼:
public partial class Default : System.Web.UI.Page
{
private const int MAX_RECORDS = 5;
protected void Page_Load(object sender, EventArgs e)
{
string filename = Server.MapPath("~/App_Data/country_revenue.csv");
if (!IsPostBack)
{
List<Revenue> revenue = GetRevenueDetail(1);
gvBSPagination.DataSource = revenue;
gvBSPagination.DataBind();
}
}
[WebMethod]
[ScriptMethod(UseHttpGet = false, ResponseFormat = ResponseFormat.Json)]
public static List<Revenue> GetRevenueDetail(int pagenumber)
{
Revenue rv = new Revenue();
List<Revenue> lstrevenue = rv.GetRevenueDetails(pagenumber,MAX_RECORDS);
return lstrevenue;
}
[WebMethod]
[ScriptMethod(UseHttpGet = false, ResponseFormat = ResponseFormat.Json)]
public static int GetTotalPageCount()
{
int count=0;
Revenue rv=new Revenue();
count = rv.GetTotalRecordCount();
count = count / MAX_RECORDS;
return count;
}
protected void gvBSPagination_PreRender(object sender, EventArgs e)
{
GridView gv = (GridView)sender;
GridViewRow pagerRow = (GridViewRow)gv.BottomPagerRow;
if (pagerRow != null && pagerRow.Visible == false)
pagerRow.Visible = true;
}
}
country_revenue.csv

項(xiàng)目運(yùn)行結(jié)果如圖:

如果大家還想深入學(xué)習(xí),可以點(diǎn)擊這里進(jìn)行學(xué)習(xí),再為大家附3個(gè)精彩的專題:
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- bootstrap table 服務(wù)器端分頁例子分享
- 完美實(shí)現(xiàn)bootstrap分頁查詢
- Angular.js與Bootstrap相結(jié)合實(shí)現(xiàn)表格分頁代碼
- Bootstrap table分頁問題匯總
- Bootstrap Paginator分頁插件使用方法詳解
- 基于bootstrap3和jquery的分頁插件
- 基于Bootstrap3表格插件和分頁插件實(shí)例詳解
- BootStrap Table 分頁后重新搜索問題的解決辦法
- 第一次動(dòng)手實(shí)現(xiàn)bootstrap table分頁效果
- BootStrap中的table實(shí)現(xiàn)數(shù)據(jù)填充與分頁應(yīng)用小結(jié)
相關(guān)文章
一個(gè)ASP.Net下的WebShell實(shí)例
一個(gè)ASP.Net下的WebShell,主要完成cmd命令。一般的服務(wù)器設(shè)置,asp.net用戶的權(quán)限都比較高。如果asp的webshell無法執(zhí)行,可能asp.net的可以執(zhí)行。2013-07-07
.NET中如何將文本文件的內(nèi)容存儲到DataSet
大家在項(xiàng)目中比較多的會對文件進(jìn)行操作,例如文件的上傳下載,文件的壓縮和解壓等IO操作。而在.NET項(xiàng)目中較多的會使用DataSet,DataTable進(jìn)行數(shù)據(jù)的緩存。每一個(gè)DataSet都是一個(gè)或多個(gè)DataTable對象的集合,本文主要介紹的是如何將文本文件的內(nèi)容存儲到DataSet里去。2016-12-12
獲取ashx得到的內(nèi)容(已處理好的數(shù)據(jù))
獲取ashx得到的內(nèi)容,一般用于ajax的情況比較多一點(diǎn);重點(diǎn):ashx頁面?zhèn)鬟^來的就是已經(jīng)處理好的數(shù)據(jù),感興趣的朋有可以參考下啊,希望本文對你學(xué)習(xí)ajax有所幫助2013-01-01
詳解mvc使用JsonResult返回Json數(shù)據(jù)
這篇文章主要介紹了詳解mvc使用JsonResult返回Json數(shù)據(jù),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下。2017-01-01
asp.net checkbox 動(dòng)態(tài)綁定id GridView刪除提示
asp.net checkbox 動(dòng)態(tài)綁定id,需要的朋友可以參考下。雖然簡單但不知道挺麻煩的。GridView刪除提示2009-10-10

