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 相关文章推荐
Code:loadScript( )加载js的功能函数
Feb 02 Javascript
Javascript 网页黑白效果实现代码(兼容IE/FF等)
Apr 23 Javascript
发布一个基于javascript的动画类 Fx.js
Nov 05 Javascript
Javascript实现禁止输入中文或英文的例子
Dec 09 Javascript
jquery实现鼠标滑过显示二级下拉菜单效果
Aug 24 Javascript
原生JS实现平滑回到顶部组件
Mar 16 Javascript
jquery实现界面无刷新加载登陆注册
Jul 30 Javascript
利用vue和element-ui设置表格内容分页的实例
Mar 02 Javascript
详解处理bootstrap4不支持远程静态框问题
Jul 20 Javascript
vue2.0 使用element-ui里的upload组件实现图片预览效果方法
Sep 04 Javascript
Postman如何实现参数化执行及断言处理
Jul 28 Javascript
OpenLayer3自定义测量控件MeasureTool
Sep 28 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
php制作动态随机验证码
2015/02/12 PHP
PHP中利用sleep函数实现定时执行功能实现代码
2016/08/25 PHP
HTML中事件触发列表与解说
2007/07/09 Javascript
javascript window.opener的用法分析
2010/04/07 Javascript
jquery异步循环获取功能实现代码
2010/09/19 Javascript
从阶乘函数对比Javascript和C#的异同
2012/05/31 Javascript
用javascript关闭本窗口技巧小结
2014/09/05 Javascript
jQuery实现表单步骤流程导航代码分享
2015/08/28 Javascript
JS实现带有抽屉效果的产品类网站多级导航菜单代码
2015/09/15 Javascript
Bootstrap select实现下拉框多选效果
2016/12/23 Javascript
jquery DataTable实现前后台动态分页
2017/06/17 jQuery
详解webpack 入门总结和实践(按需异步加载,css单独打包,生成多个入口文件)
2017/06/20 Javascript
js字符串类型String常用操作实例总结
2019/07/05 Javascript
JS在Array数组中按指定位置删除或添加元素对象方法示例
2019/11/19 Javascript
python通过scapy获取局域网所有主机mac地址示例
2014/05/04 Python
Python中的进程分支fork和exec详解
2015/04/11 Python
python检查指定文件是否存在的方法
2015/07/06 Python
Python 中 Virtualenv 和 pip 的简单用法详解
2017/08/18 Python
wxPython实现窗口用图片做背景
2018/04/25 Python
pycharm下查看python的变量类型和变量内容的方法
2018/06/26 Python
python使用循环打印所有三位数水仙花数的实例
2018/11/13 Python
pygame游戏之旅 添加游戏界面按键图形
2018/11/20 Python
如何使用Python自动控制windows桌面
2019/07/11 Python
基于python实现从尾到头打印链表
2019/11/02 Python
python科学计算之narray对象用法
2019/11/25 Python
W3C公布最新的HTML5标准草案
2008/10/17 HTML / CSS
HTML5页面嵌入小程序没有返回按钮及返回页面空白的问题
2020/05/28 HTML / CSS
公司财务总监岗位职责
2013/12/14 职场文书
内业资料员岗位职责
2014/01/04 职场文书
中学生打架检讨书
2014/02/10 职场文书
《云房子》教学反思
2014/04/20 职场文书
党建工作先进材料
2014/05/02 职场文书
小学校长竞聘演讲稿
2014/05/16 职场文书
高中教师考核方案
2014/05/18 职场文书
部门群众路线教育实践活动对照检查材料思想汇报
2014/10/07 职场文书
教师岗位职责
2015/02/03 职场文书