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判断单选框或复选框是否选中方法集锦
Apr 04 Javascript
Js放到HTML文件中的哪个位置有什么区别
Aug 21 Javascript
js仿腾讯QQ的web登陆界面
Aug 19 Javascript
input 禁止输入特殊字符的四种实现方式
Aug 24 Javascript
ajax接收后台数据在html页面显示
Feb 19 Javascript
JS原型继承四步曲及原型继承图一览
Nov 28 Javascript
JS抛物线动画实例制作
Feb 24 Javascript
Vue-cli配置打包文件本地使用的教程图解
Aug 02 Javascript
微信小程序websocket聊天室的实现示例代码
Feb 12 Javascript
Vue实现商品分类菜单数量提示功能
Jul 26 Javascript
layui使用label标签的方法
Sep 14 Javascript
jQuery--遍历操作实例小结【后代、同胞及过滤】
May 22 jQuery
一个简单的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
用php解析html的实现代码
2011/08/08 PHP
基于Zend的Config机制的应用分析
2013/05/02 PHP
从PHP的源码中深入了解stdClass类
2014/04/18 PHP
thinkphp5 加载静态资源路径与常量的方法
2017/12/24 PHP
JavaScript中的prototype使用说明
2010/04/13 Javascript
UserData用法总结 lanyu出品
2010/07/01 Javascript
JavaScript在IE和FF下的兼容性问题
2014/05/19 Javascript
使用mini-define实现前端代码的模块化管理
2014/12/25 Javascript
AngularJS 遇到的小坑与技巧小结
2016/06/07 Javascript
JavaScript中的Reflect对象详解(ES6新特性)
2016/07/22 Javascript
详解AngularJS ui-sref的简单使用
2017/04/24 Javascript
JavaScript之class继承_动力节点Java学院整理
2017/07/03 Javascript
JS中Promise函数then的奥秘探究
2018/07/30 Javascript
Vue-Router的使用方法
2018/09/05 Javascript
如何从头实现一个node.js的koa框架
2019/06/17 Javascript
Javascript Dom元素获取和添加详解
2019/09/24 Javascript
结合axios对项目中的api请求进行封装操作
2020/09/21 Javascript
python实现的用于搜索文件并进行内容替换的类实例
2015/06/28 Python
不要用强制方法杀掉python线程
2017/02/26 Python
Matplotlib中文乱码的3种解决方案
2018/11/15 Python
Python关于反射的实例代码分享
2020/02/20 Python
python打开文件的方式有哪些
2020/06/29 Python
零基础学Python之前需要学c语言吗
2020/07/21 Python
python selenium xpath定位操作
2020/09/01 Python
HTML5 客户端数据库简易使用:IndexedDB
2019/12/19 HTML / CSS
英国性感内衣和睡衣品牌:Bluebella
2018/01/26 全球购物
印度化妆品购物网站:Nykaa
2018/07/22 全球购物
个人充满哲理的自我评价
2014/02/20 职场文书
小学课外活动总结
2014/07/09 职场文书
员工开除通知书
2015/04/25 职场文书
毕业设计答辩开场白
2015/05/29 职场文书
工作经历证明范本
2015/06/15 职场文书
大一新生军训新闻稿
2015/07/17 职场文书
《日月潭》教学反思
2016/02/20 职场文书
详解CocosCreator项目结构机制
2021/04/14 Javascript
win10此电脑打不开怎么办 win10双击此电脑无响应的解决办法
2022/07/23 数码科技