前台ajax加载数据
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script src="~/Scripts/jquerytemplate.js"></script>
function sendPostRequest(targetUrl, parameters, successCallback, errorCallback) {
$.ajax({
type: "POST",
url: targetUrl,
data: parameters,
contentType: "application/json; charset=utf-8",
dataType: "json",
async: true,
success: successCallback,
timeout: 30000,
error: function (e) {
if (e.responseText == "") return;
if (e.status == 300) {
if (JSON.parse(e.responseText) == "RequireLogon") {
return;
} else if (JSON.parse(e.responseText) == "Unauthorized") {
return;
}
} else if (e.status == 401 && e.statusText == "Unauthorized") {
return;
}
if (e.statusText == "timeout") {
alert("服务器忙");
errorCallback && errorCallback(e);
} else if (e) {
errorCallback && errorCallback(e);
}
}
});
}
function drawPagination(container, pageIndex, pageSize, dataCount, pageChangedCallback) {
if (dataCount > 0) {
var pageCount = parseInt((dataCount + pageSize - 1) / pageSize);
var contents = new Array();
contents.push('<div class="dataPager clearfix">');
if (pageIndex > 1) {
contents.push('<a id="pager_lbnFirst" value=1>首页</a>');
contents.push('<a id="pager_lbnPrev" value=' + (pageIndex - 1) + '>< 上一页</a>');
}
contents.join('<span id="pPages">');
for (var i = pageIndex - 4; i <= pageIndex + 4; i++) {
if (i == pageIndex) {
contents.push('<a id="pager_lbPage' + i + '" disabled="disabled" class="yemaa" style="margin-left:5px;margin-right:5px;text-decoration:none;">' + i + '</a>');
} else if (i > 0 && i <= pageCount) {
contents.push('<a id="pager_lbPage' + i + '" value=' + i + ' style="margin-left:5px;margin-right:5px;">' + i + '</a>');
}
}
contents.join('</span>');
if (pageIndex < pageCount) {
contents.push('<a id="pager_lbnNext" value=' + (pageIndex + 1) + '>下一页 ></a>');
contents.push('<a id="pager_lbnLast" value=' + pageCount + '>末页</a>');
}
contents.push('共 <span id="pager_lblTotalCount">' + dataCount);
contents.push('</span> 条 每页 <span id="pager_lblPageSize">' + pageSize);
contents.push('</span> 条 第 <span id="lblCurrentPage">' + pageIndex + '</span> / <span id="pager_lblTotalPage">' + pageCount + '</span> 页</div>');
container.html(contents.join(''));
if (pageChangedCallback) {
$("a", container).click(function () {
var self = $(this);
if (!self.attr("disabled")) {
pageChangedCallback(self.attr("value"));
}
});
}
container.show();
} else {
container.html('');
container.hide();
}
}
<script type="text/javascript">
var paging = {
PageIndex: 1,
PageSize: 10
};
//查询的方法
function queryOrders(pageIndex, pageSize) {
if (!pageIndex) pageIndex = paging.PageIndex;
pageSize = pageSize || paging.PageSize;
var pagination = getQueryOrdersPagination(pageIndex, pageSize);
var parameters = getCondition(pagination);
var condition = JSON.stringify({ "condition": parameters });
sendPostRequest("/IntegralRull/FindIntegralRull", condition, function (data) {
bindData(data);
}, function (e) {
if (e.statusText == "timeout") {
alert("服务器忙");
} else {
alert(e.responseText);
}
});
return false;
}
//查询的条件
function getCondition(pagination) {
pagination.BeginDate = $.trim($("#beginTime").val());
pagination.EndDate = $.trim($("#endTime").val());
pagination.Enable = -1;// $.trim($("").val());
return pagination;
}
function getQueryOrdersPagination(pageIndex, pageSize) {
return { "Pz": pageSize, "Pn": pageIndex };
}
function bindData(data) {
$("#dataList").html($("#temp").tmpl(data.Data));
drawPagination($("#pager"), data.Pagination.PageIndex, data.Pagination.PageSize, data.Pagination.RowCount, queryOrders);
}
$(function () {
queryOrders(paging.PageIndex, paging.PageSize);
$("#btnSearch").click(function () {
queryOrders(paging.PageIndex, paging.PageSize);
});
});
</script>
<script type="text/x-jquery-tmpl" id="temp">
<tr>
<td>${Id}</td>
<td>${money}</td>
<td>${Integral}</td>
<td>${CreateDate}</td>
<td>${ifEnable}</td>
<td>删除</td>
</tr>
</script>
前台ajax加载数据的更多相关文章
- 一起学爬虫——如何爬取通过ajax加载数据的网站
目前很多网站都使用ajax技术动态加载数据,和常规的网站不一样,数据时动态加载的,如果我们使用常规的方法爬取网页,得到的只是一堆html代码,没有任何的数据. 请看下面的代码: url = 'http ...
- Ajax加载数据的使用
需求就是不能再进入页面时加载数据,只能在点击其中一个按钮时把数据加载呈现出来.具体效果如最下面的图. 1.前台页面 <h1 " onclick="GetData(1)&quo ...
- Ajax 加载数据 练习 自我有些迷糊了,写的大概请谅解 ^ _ ^
查询表的显示,查询显示如果不嵌入PHP代码的话,用ajax怎么实现? <h1>显示数据</h1> <table width="100%" bord ...
- table+ajax加载数据
//ajax加载notice $(function() { //${pageContext.request.contextPath}/ /** var res = [ {noticeTitle:'必答 ...
- Ajax加载数据后百度分享实例
<script type="text/javascript"> //百度分享 function baidu_share() { var title_val = $(&q ...
- ext grid 前台grid加载数据碰到数据重复只显示一条
在使用gridPanel的时候,如果其数据有字段名为“id”,且数据中id值相同的情况时,相同id的数据只会显示一条,这是因为Ext读取JSON数据的时候采用了类似主键唯一的方式,而这里的主键默认叫“ ...
- ajax 加载数据前的刷新动画
$(document).ready(function(){ $.ajax({ type:"get", cache:false, u ...
- Ajax 滚动异步加载数据
第一种情况:单个div滚动 HTML <body> <!-- search start --> <div class="search" #if($m_ ...
- Bootstrap-Select 动态加载数据的小记
关于前端框架系列的可以参考我我刚学Bootstrap时候写的LoT.UI http://www.cnblogs.com/dunitian/p/4822808.html#lotui bootstrap- ...
随机推荐
- extern用法详解
1 基本解释 extern可以置于变量或者函数前,以标示变量或者函数的定义在别的文件中,提示编译器遇到此变量和函数时在其他模块中寻找其定义. 另外,extern也可用来进行链接指定. 2 问题:ext ...
- 通过 bootloader 向其传输启动参数
作者:Younger Liu, 本作品采用知识共享署名-非商业性使用-相同方式共享 3.0 未本地化版本许可协议进行许可. Linux提供了一种通过bootloader向其传输启动参数的功能,内核开发 ...
- (转载)Linux查看文件编码格式及文件编码转换
Linux查看文件编码格式及文件编码转换 时间:2011-04-08作者:woyoo分类:linux评论:0 我友分享: 新浪微博 腾讯微博 搜狐微博 网易微博 开心网 QQ空间 msn 如果你需要在 ...
- ajax从新浪获取实时股票数据
最近在给公司做一个报表展示,然后领导要求上面加上一些股票的实时数据展示. 一开始同事给我一个聚合数据的网址,说从这上面可以获取到.我一看,哟呵,API接口什么的都提供好了,确实方便.然后想用的时候才发 ...
- 谷歌广告Admob在cocos2dx上通过回调实现底部Banner
首先说明我的开发平台,以免由于平台问题造成不必要的误解: cocos2dx-3.4 ndk-r9d eclipse Admob是谷歌官方广告,已经集成在google_play_service_lib包 ...
- Java中File
1.什么是流? Java中的流是个抽象的概念,当程序需要从某个数据源读入数据的时候,就会开启一个数据流,数据源可以是文件.内存或网络等等.2.使用File类操作文件或目录属性 public class ...
- Excel 数据导出
Web controller /// <summary> /// 导出数据 /// </summary> /// <param name="UserID&qu ...
- [js笔记整理]DOM 篇
一.节点类型 1.元素节点:HTML元素 2.文本节点:元素标签中的内容 3.属性节点:元素的属性 (检测节点类型:node.nodeType //元素=1,属性=2,文本=3) 二.使用DOM获取元 ...
- Kafka学习-入门
在上一篇kafka简介的基础之上,本篇主要介绍如何快速的运行kafka. 在进行如下配置前,首先要启动Zookeeper. 配置单机kafka 1.进入kafka解压目录 2.启动kafka bin\ ...
- 单词计数,杭电0j-2072
原题地址:http://acm.hdu.edu.cn/showproblem.php?pid=2072 [Problem Description] lily的好朋友xiaoou333最近很空,他想了一 ...