编程 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 相关文章推荐

JS中字符串trim()使用示例

May 26 Javascript

JS中Eval解析JSON字符串的一个小问题

Feb 21 Javascript

vue,angular,avalon这三种MVVM框架优缺点

Apr 27 Javascript

基于JS实现数字+字母+中文的混合排序方法

Jun 06 Javascript

js中利用cookie实现记住密码功能

Aug 20 Javascript

js实现截图保存图片功能的代码示例

Feb 16 Javascript

JS实现的四级密码强度检测功能示例

May 11 Javascript

AngualrJs清除定时器遇到的坑

Oct 13 Javascript

利用JavaScript的%做隔行换色的实例

Nov 25 Javascript

Less 安装及基本用法

May 05 Javascript

使用Vue.js 和Chart.js制作绚丽多彩的图表

Jun 15 Javascript

vuex vue简单使用知识点总结

Aug 29 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

摩卡咖啡

2021/03/03 咖啡文化

COM in PHP (winows only)

2006/10/09 PHP

require(),include(),require_once()和include_once()区别

2008/03/27 PHP

PHP 面向对象程序设计（oop）学习笔记(三) - 单例模式和工厂模式

2014/06/12 PHP

ThinkPHP3.1新特性之多数据库操作更加完善

2014/06/19 PHP

PHP也能干大事之PHP中的编码解码详解

2015/04/20 PHP

PHP中使用substr()截取字符串出现中文乱码问题该怎么办

2015/10/21 PHP

php微信公众平台开发（四）回复功能开发

2016/12/06 PHP

php使用Swoole实现毫秒级定时任务的方法

2020/09/04 PHP

JavaScript 权威指南(第四版) 读书笔记

2009/08/11 Javascript

jQuery html() in Firefox (uses .innerHTML) ignores DOM changes

2010/03/05 Javascript

ext中store.load跟store.reload的区别示例介绍

2014/06/17 Javascript

Internet Explorer 11 浏览器介绍：别叫我IE

2014/09/28 Javascript

jquery+json实现数据二级联动的方法

2015/11/28 Javascript

AngularJS 最常用的功能汇总

2016/02/17 Javascript

vue-cli的webpack模板项目配置文件分析

2017/04/01 Javascript

详解Vue改变数组中对象的属性不重新渲染View的解决方案

2018/09/21 Javascript

浅析Proxy可以优化vue的数据监听机制问题及实现思路

2018/11/29 Javascript

为vue项目自动设置请求状态的配置方法

2019/06/09 Javascript

JS实现简易留言板特效

2019/12/23 Javascript

[02:48]DOTA2超级联赛专访海涛：你们的选择没有错

2013/06/07 DOTA

Python3.2中Print函数用法实例详解

2015/05/19 Python

Python基于Tkinter的HelloWorld入门实例

2015/06/17 Python

浅谈Python_Openpyxl使用（最全总结）

2019/09/05 Python

Pandas之read_csv()读取文件跳过报错行的解决

2020/04/21 Python

Python3如何实现Win10桌面自动切换

2020/08/11 Python

HTML5和以前HTML4的区别整理

2013/10/20 HTML / CSS

amazeui模态框弹出后立马消失并刷新页面

2020/08/19 HTML / CSS

YSL圣罗兰美妆俄罗斯官网：Yves Saint Lauret RU

2020/09/23 全球购物

优秀大学生推荐信范文

2013/11/28 职场文书

省三好学生申请材料

2014/01/22 职场文书

个人遵守党的政治纪律情况对照检查材料

2014/09/26 职场文书

干部作风建设个人剖析材料

2014/10/11 职场文书

简单租房协议书

2014/10/21 职场文书

整改落实自查报告

2014/11/05 职场文书

CSS中妙用 drop-shadow 实现线条光影效果

2021/11/11 HTML / CSS