jquery+ashx无刷新GridView数据显示插件(实现分页、排序、过滤功能)


Posted in Javascript onApril 25, 2010

理由:jquery简单,兼容性好且容易封装。废话不多说,马上开始我们的Jquery插件编写吧。应该有很多人写过类似的插件,我也是有些模仿flexGrid的形式。

需求:GridView显示数据,无刷新分页,无刷新排序,无刷新过滤(搜索数据),基于ASP.NET(我们这里有ashx一般处理文件来实现)。

使用到技术:asp.net2.0, jquery,css

首先写的是jquery插件方面,使用的核心函数还是jquery的ajax函数,方便快捷。

$.ajax({ 
type: p.method, 
url: p.url, 
data:param, 
success: function(msg){ 
$.AddData(msg,showbox,p); 
}, 
error: function(msg){$.ErrorAjax(showbox,p.errorMsg);}, 
beforeSend:function(){$.AddLoading(showbox);}, 
complete:function(){$.MoveLoading(showbox);} 
});

看了就这么简单的一句,jquery就是比较爽的。具体的代码请下载下面的附件查看哦。

先发张生成后结果图来看看(样式不是很好看,需要的自己掂量着修改吧)

 jquery+ashx无刷新GridView数据显示插件(实现分页、排序、过滤功能)

排序和过滤功能

jquery+ashx无刷新GridView数据显示插件(实现分页、排序、过滤功能)

jquery+ashx的无刷新分页功能

jquery+ashx无刷新GridView数据显示插件(实现分页、排序、过滤功能)

其实这里除了jquery充当整个插件的主要架构外,另外一个重要的文件就是ashx这个一般处理文件啦。ashx在我整个jqueryGrid插件中输出{\n page:1,\ntotal:0,pages:1,rows:'',cols:''}这样的json代码,相信用过josn的朋友都明白。其中为了减少错误我用了一个第三方插件Newtonsoft.Json,这是格式化json字符串的JsonConvert.DeserializeObject()这个函数就是啦。

当然该功能插件之适合用于web应用程序和内部网站中,对于网站来说有些不适合,毕竟从SEO角度来讲jquery直接生成的数据是不是很好的显示方式。不多说了,大家可以看看我的代码,如果对该插件有更好的建议或者修改欢迎交流。
jquery+ashx无刷新GridView数据显示插件下载

Javascript 相关文章推荐
javascript 检测浏览器类型和版本的代码
Sep 15 Javascript
JavaScript 序列化对象实现代码
Dec 18 Javascript
JS实现点击下载的小例子
Jul 10 Javascript
jquery隔行换色效果实现方法
Jan 15 Javascript
JavaScript实现控制打开文件另存为对话框的方法
Apr 17 Javascript
jquery插件hiAlert实现网页对话框美化
May 03 Javascript
详解AngularJS中的http拦截
Feb 09 Javascript
基于js中的原型、继承的一些想法
Aug 10 Javascript
javascript构造函数以及原型对象的理解
Jan 13 Javascript
vue.js使用v-if实现显示与隐藏功能示例
Jul 06 Javascript
JS中使用react-tooltip插件实现鼠标悬浮显示框
May 15 Javascript
JavaScript创建、读取和删除cookie
Sep 03 Javascript
一个简单的jQuery插件制作 学习过程及实例
Apr 25 #Javascript
Javascript中的相等与不等运算
Apr 25 #Javascript
下载网站打开页面后间隔多少时间才显示下载链接地址的代码
Apr 25 #Javascript
jQuery 打造动态渐变按钮 详细图文教程
Apr 25 #Javascript
javascript之学会吝啬 精简代码
Apr 25 #Javascript
一些相见恨晚的 JavaScript 技巧
Apr 25 #Javascript
Javascript 中的 && 和 || 使用小结
Apr 25 #Javascript
You might like
全国FM电台频率大全 - 7 吉林省
2020/03/11 无线电
PHP自动生成月历代码
2006/10/09 PHP
浅谈php命令行用法
2015/02/04 PHP
php实现比较两个字符串日期大小的方法
2015/05/12 PHP
浅析php-fpm静态和动态执行方式的比较
2016/11/09 PHP
老生常谈PHP面向对象之注册表模式
2017/05/26 PHP
Windows下wamp php单元测试工具PHPUnit安装及生成日志文件配置方法
2018/05/28 PHP
Jquery 基础学习笔记之文档处理
2009/05/29 Javascript
js 父窗口控制子窗口的行为-打开,关闭,重定位,回复
2010/04/20 Javascript
整理一些JavaScript的IE和火狐的兼容性注意事项
2011/03/17 Javascript
JS中如何设置readOnly的值
2013/12/25 Javascript
关闭页面时window.location事件未执行的原因分析及解决方案
2014/09/01 Javascript
js学习总结之DOM2兼容处理this问题的解决方法
2017/07/27 Javascript
vue服务端渲染的实例代码
2017/08/28 Javascript
通过vue-cli来学习修改Webpack多环境配置和发布问题
2017/12/22 Javascript
详解Vue的常用指令v-if, v-for, v-show,v-else, v-bind, v-on
2018/10/12 Javascript
js字符串倒序的实例代码
2018/11/30 Javascript
Vue 样式绑定的实现方法
2019/01/15 Javascript
微信小程序wepy框架学习和使用心得详解
2019/05/24 Javascript
Python常用时间操作总结【取得当前时间、时间函数、应用等】
2017/05/11 Python
Python实现读取txt文件并画三维图简单代码示例
2017/12/09 Python
python3+PyQt5实现自定义流体混合窗口部件
2018/04/24 Python
Python字典中的键映射多个值的方法(列表或者集合)
2018/10/17 Python
pytorch 预训练层的使用方法
2019/08/20 Python
python栈的基本定义与使用方法示例【初始化、赋值、入栈、出栈等】
2019/10/24 Python
python实现LRU热点缓存及原理
2019/10/29 Python
jupyter notebook 多行输出实例
2020/04/09 Python
python爬虫实例之获取动漫截图
2020/05/31 Python
HTML5 使用 sessionStorage 进行页面传值的方法
2018/07/02 HTML / CSS
大学生应聘自荐信
2013/10/11 职场文书
2014世界杯球队球队口号
2014/06/05 职场文书
大学生档案自我鉴定(2篇)
2014/10/14 职场文书
社区学习党的群众路线教育实践活动心得体会
2014/11/03 职场文书
春季运动会加油词
2015/07/18 职场文书
2019年行政人事个人工作总结范本!
2019/07/19 职场文书
python实现求纯色彩图像的边框
2021/04/08 Python