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的变量作用域深入理解
Oct 25 Javascript
js通过googleAIP翻译PHP系统的语言配置的实现代码
Oct 17 Javascript
javascript采用数组实现tab菜单切换效果
Dec 12 Javascript
JS中prototype关键字的功能介绍及使用示例
Jul 21 Javascript
原生JS操作网页给p元素添加onclick事件及表格隔行变色
Dec 01 Javascript
js使下拉列表框可编辑不止是选择
Dec 12 Javascript
Jquery Mobile 自定义按钮图标
Nov 18 Javascript
JavaScript实现点击按钮字体放大、缩小
Feb 29 Javascript
Jquery EasyUI实现treegrid上显示checkbox并取选定值的方法
Apr 29 Javascript
原生js实现回复评论功能
Jan 18 Javascript
使用RN Animated做一个“添加购物车”动画的方法
Sep 12 Javascript
vue集成chart.js的实现方法
Aug 20 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
PHP4之真OO
2006/10/09 PHP
php的list()的一步操作给一组变量进行赋值的使用
2011/05/18 PHP
PHP输入流php://input介绍
2012/09/18 PHP
PHP实现的激活用户注册验证邮箱功能示例
2017/06/06 PHP
PHP结合Vue实现滚动底部加载效果
2017/12/17 PHP
thinkphp5框架前后端分离项目实现分页功能的方法分析
2019/10/08 PHP
linux mint下安装phpstorm2020包括JDK部分的教程详解
2020/09/17 PHP
拖动Html元素集合 Drag and Drop any item
2006/12/22 Javascript
javascript 时间比较实现代码
2009/10/28 Javascript
javascript 事件处理、鼠标拖动效果实现方法详解
2012/05/11 Javascript
jQuery 1.8 Release版本发布了
2012/08/14 Javascript
Extjs grid添加一个图片状态或者按钮的方法
2014/04/03 Javascript
js获取鼠标点击的位置实现思路及代码
2014/05/09 Javascript
jQuery创建DOM元素实例解析
2015/01/19 Javascript
jquery实现的Accordion折叠面板效果代码
2015/09/02 Javascript
浅析BootStrap Treeview的简单使用
2016/10/12 Javascript
node+express框架中连接使用mysql(经验总结)
2018/11/10 Javascript
基于p5.js 2D图像接口的扩展(交互实现)
2020/11/30 Javascript
Python和JavaScript间代码转换的4个工具
2016/02/22 Python
Python内置函数OCT详解
2016/11/09 Python
Python实现的单向循环链表功能示例
2017/11/10 Python
python 实现在Excel末尾增加新行
2018/05/02 Python
pytorch中如何使用DataLoader对数据集进行批处理的方法
2019/08/06 Python
django自带的权限管理Permission用法说明
2020/05/13 Python
python实现人性化显示金额数字实例详解
2020/09/25 Python
python中pyplot基础图标函数整理
2020/11/10 Python
美国LOGO设计公司:The Logo Company
2018/07/16 全球购物
毕业生自我鉴定范文
2013/11/08 职场文书
给客户的道歉信
2014/01/13 职场文书
企业演讲比赛主持词
2014/03/18 职场文书
药剂专业自荐信范文
2014/04/16 职场文书
5s标语大全
2014/06/23 职场文书
学雷锋志愿者活动方案
2014/08/21 职场文书
文秘班元旦晚会活动策划方案
2014/08/28 职场文书
小学英语教学随笔
2015/08/14 职场文书
php引用传递
2021/04/01 PHP