您的位置:首页 > Web前端

我的前端分页

2015-09-08 17:37 316 查看
如下:

@{
ViewBag.Title = "OrderList";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<script src="~/Scripts/TMinjiCommon.js"></script>
<script>
(function () {

var getOrderList = function (pageNumber, pageSize) {
$.ajax({
type: "post",
datatype: "json",
url: "/order/GetAllOrder",
async: true,
cache: false,
data: { pageNumber: pageNumber, pageSize: pageSize },
success: function (data) {
if (data.F == 1) {
alert(data.M);
return;
}

var firstPage = 1;
var prePage = 1;
var nextPage = 1;
var lastPage = 1;
var currentPage = 1;

if (data.O == null || data.O.length == 0) {
$("#pageInfo").html("对不起,没有数据!");
}
else {
currentPage = Math.ceil(data.O[0].ReqIndex / 10);
lastPage = Math.ceil(data.O[0].ReqCount / 10);
prePage = currentPage - 1;
nextPage = currentPage + 1;
if (prePage < 1)
prePage = 1;
if (nextPage > lastPage)
nextPage = lastPage

$("#firstPage").one("click", function () {
$("#pcontent").html("");
$("#pageInfo").html("获取数据中……");
getOrderList(1, 10);
});

$("#prePage").one("click", function () {
$("#pcontent").html("");
$("#pageInfo").html("获取数据中……");
getOrderList(prePage, 10);
});

$("#nextPage").one("click", function () {
$("#pcontent").html("");
$("#pageInfo").html("获取数据中……");
getOrderList(nextPage, 10);
});

$("#lastPage").one("click", function () {
$("#pcontent").html("");
$("#pageInfo").html("获取数据中……");
getOrderList(lastPage, 10);
});

var pi = "总" + data.O[0].ReqCount + "条,总"
+ lastPage + "页,当前第"
+ currentPage + "页";// + ",上一页"+ prePage + "下一页" + nextPage;

$("#pageInfo").html(pi);
}

var con = "";
//alert(data.F);
$.each(data.O, function (i, item) {
con += '<tr>';
con += '<td><input type="checkbox" name="checkbox" /></td> ';
con += '<td>' + item.UserName + '</td>';
con += '<td>' + item.order_code + '</td>';
con += '<td>¥' + item.price1 + '</td>';
con += '<td>' + TMinjiCommon.FormatTime(item.order_time) + '</td>';
con += '<td><span class="label label-important">未支付</span></td>';
con += '<td><span class="label label-important">未配送</span></td>';
con += '<td><span class="label label-success">详细信息</span></td>';
con += '<td></td>';
con += '</tr>';
});
//alert(data.F);

$("#orderCon").html(con);
},
error: function (xhr, status, err) {
alert(err);
}
});
};

return TMinji = {
GetOrderList: getOrderList
};
})();

$(function () {
TMinji.GetOrderList(1, 10);
});
</script>

<div class="panel panel-default">
<div class="panel-heading">订单管理</div>
<div class="panel-body">
<div class="panel">
<table>
<tr>
<td>订单编号:</td>
<td><input type="text" name="search1" id="search1" value="" /></td>
<td><button class="btn btn-warning" type="button"> 检索</button></td>
<td style="width:5px;"></td>
</tr>
</table>
</div>
<div class="panel panel-default">
<table class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th width="30"><input type="checkbox" class="checkall" /></th>
<th width="100">购买会员</th>
<th width="100">订单编号</th>
<th width="100">订单总价</th>
<th width="150">下单时间</th>
<th width="100">支付状态</th>
<th width="100">配送状态</th>
<th width="180">操作</th>
</tr>
</thead>
<tbody id="orderCon"></tbody>
</table>
</div>

<div>
<span><a href="#" id="firstPage">首页</a></span>
<span><a href="#" id="prePage">上一页</a></span>
<span><a href="#" id="nextPage">下一页</a></span>
<span><a href="#" id="lastPage">末页</a></span>
<span id="pageInfo"></span>
</div>
</div>

</div>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: