编程 Javascript

JQuery的ajax基础上的超强GridView展示

Posted in Javascript onSeptember 18, 2009

看到一个这样的例子和大家分享下。这个一直是我想要做到的。
首先先展示下最终的样子：
JQuery的ajax基础上的超强GridView展示
使用northwind的数据。点击前面的加号会把其它属于这个产品的详细订单展示出来,而每个产品后面都会有它的订单个数。点击'+'后的样子:

先分析下它的实现:

第一个图的显示是个Gridview,当点击每条记录前面的'+'时会使用jQuery的ajax功能调用一个Web Method,并传输一个当前产品的ID进去,然后会定义一个继承UserControl的类,它能够添加一个ascx文件,然后这个类里面定义一个View State的字段。

当点击每个'+'时使用jQuery把这个ascx文件显示在当前产品的下面slideshow(),那么id是如何传的呢？这就用到了View State。

关于View State的介绍很多的。我也没怎么用过。这里简单说明下它和一个Web Control的关系:

JQuery的ajax基础上的超强GridView展示

下面给出大家代码:

这个是产品的GridView。

JQuery的ajax基础上的超强GridView展示

然后是Web Method:

JQuery的ajax基础上的超强GridView展示

Control类:

JQuery的ajax基础上的超强GridView展示

CustomerOrder.ascx代码:

JQuery的ajax基础上的超强GridView展示

整个调用Web Method的ajax代码:

JQuery的ajax基础上的超强GridView展示

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

用javascript获取当页面上鼠标光标位置和触发事件的对象的代码

Dec 09 Javascript

滚动条变色隐藏滚动条与双击网页自动滚屏显示代码

Dec 28 Javascript

HTML Dom与Css控制方法

Oct 25 Javascript

contains和compareDocumentPosition 方法来确定是否HTML节点间的关系

Sep 13 Javascript

input链接页面、打开新网页等等的具体实现

Dec 30 Javascript

Jquery在指定DIV加载HTML示例代码

Feb 17 Javascript

jquery css 设置table的奇偶行背景色示例

Jun 03 Javascript

JS遍历数组及打印数组实例分析

Jan 21 Javascript

jQuery实现的瀑布流加载效果示例

Sep 13 Javascript

JavaScript组件开发之输入框加候选框

Mar 10 Javascript

VUE + UEditor 单图片跨域上传功能的实现方法

Feb 08 Javascript

解决vue+element 键盘回车事件导致页面刷新的问题

Aug 25 Javascript

jQuery 事件队列调整方法

Sep 18 #Javascript

javascript 面向对象编程 function是方法(函数)

Sep 17 #Javascript

javascript 面向对象编程聊聊对象的事

Sep 17 #Javascript

javascript 面向对象编程万物皆对象

Sep 17 #Javascript

javascript 面向对象编程 function也是类

Sep 17 #Javascript

类似CSDN图片切换效果脚本

Sep 17 #Javascript

var与Javascript变量隐式声明

Sep 17 #Javascript

You might like

php高级编程-函数-郑阿奇

2011/07/04 PHP

PHP四舍五入、取整、round函数使用示例

2015/02/06 PHP

CI(Codeigniter)的Setting增强配置类实例

2016/01/06 PHP

ThinkPHP3.1.x修改成功与失败跳转页面的方法

2017/09/29 PHP

Laravel 创建指定表 migrate的例子

2019/10/09 PHP

JavaScript设置首页和收藏页面的小例子

2013/11/11 Javascript

使用原生JS实现弹出层特效

2014/12/22 Javascript

CSS+JS实现点击文字弹出定时自动关闭DIV层菜单的方法

2015/05/12 Javascript

JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法

2015/07/01 Javascript

javascript实现标签切换代码示例

2016/05/22 Javascript

微信小程序教程之注册程序

2016/10/17 Javascript

jQuery Mobile和HTML5开发App推广注册页

2016/11/07 Javascript

JavaScript之WebSocket技术详解

2016/11/18 Javascript

JavaScript中this的用法及this在不同应用场景的作用解析

2017/04/13 Javascript

详解React Native网络请求fetch简单封装

2017/08/10 Javascript

JS+Canvas绘制动态时钟效果

2017/11/10 Javascript

通过封装scroll.js 获取滚动条的值

2018/07/13 Javascript

使用Nuxt.js改造已有项目的方法

2018/08/07 Javascript

详解vue-cli项目开发/生产环境代理实现跨域请求

2019/07/23 Javascript

js实现简单五子棋游戏

2020/05/28 Javascript

javascript实现京东快递单号的查询效果

2020/11/30 Javascript

vue项目中openlayers绘制行政区划

2020/12/24 Vue.js

[01:20:06]TNC vs VG 2018国际邀请赛小组赛BO2 第二场 8.16

2018/08/17 DOTA

Python网站验证码识别

2016/01/25 Python

利用python3随机生成中文字符的实现方法

2017/11/24 Python

python OpenCV学习笔记直方图反向投影的实现

2018/02/07 Python

Python使用re模块实现信息筛选的方法

2018/04/29 Python

详解python使用turtle库来画一朵花

2019/03/21 Python

python通过cython加密代码

2020/12/11 Python

python+opencv3.4.0 实现HOG+SVM行人检测的示例代码

2021/01/28 Python

CSS3教程(9):设置RGB颜色

2009/04/02 HTML / CSS

HTML5 本地存储和内容按需加载的思路和方法

2011/04/07 HTML / CSS

Python如何实现单例模式

2016/06/03 面试题

大学生自我评价怎样写好

2013/10/23 职场文书

财务主管岗位职责

2014/02/28 职场文书

初三开学计划书

2014/04/27 职场文书