博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Ext.Net学习笔记16:Ext.Net GridPanel 折叠/展开行
阅读量:5994 次
发布时间:2019-06-20

本文共 1758 字,大约阅读时间需要 5 分钟。

Ext.Net GridPanel的行支持折叠/展开功能,这个功能个人觉得还说很有用处的,尤其是数据中包含图片等内容的时候。

下面来看看效果:

image

使用行折叠/展开功能之后,在Ext.Net GridPanel的行头会出现一个展开图标,点击图标以后能够将这一行展开:

image

使用XTemplate实现行折叠/展开

这是最简单的一种实现,我们只需要在GridPanel的定义中加入下面的代码:

这里面使用到了Tpl,这里面包含了我们展开后要显示的内容,数据就是当前行的数据。

从服务器获取展开时显示的数据

通常情况下我们不会一次将所有数据都获取到客户端,而是通过异步加载的方式按需获取要显示的数据

在Ext.Net GridPanel中,如果要在展开的时候从服务器获取数据,我们需要完成如下代码:

第一步:为了配合演示,先为我们的Model添加一个Time属性,我们通过异步的方式去服务器端获取当前时间:

第二步:修改我们的RowExpander定义,我们需要将Template定义在Bin下,并为RowExpander添加事件:

姓名:
{Name}
年龄:
{Age}
时间:
{Time}

第三步:定义服务器端的DirectMethod方法:

[DirectMethod]public static string GetDetail(string name){    return DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");}

第四步:定义客户端的Expand方法:

var MyApp = {    onExpand: function (data, template, container) {        if (data.Time) return;        App.direct.GetDetail(data.Name, {                success: function (time) {                    data.Time = time;                    template.overwrite(container.getEl(), data);                },                eventMask : { showMask : true }            }        );    }};本文转自齐师傅博客园博客,原文链接:http://www.cnblogs.com/youring2/p/3568361.html,如需转载请自行联系原作者
你可能感兴趣的文章
Java List 遍历
查看>>
Java 07 example
查看>>
RF框架搭建
查看>>
Redis 与 数据库处理数据的两种模式
查看>>
SQL语句关联查询
查看>>
python学习 day4
查看>>
Ubuntu 下安装Kibana和logstash
查看>>
js在mootools框架下的new Class
查看>>
Oracle select case when
查看>>
matlab print,disp,fprint,fscan
查看>>
Remove Nth Node From End of List
查看>>
301重定向与302跳转有什么区别?
查看>>
类似于Mimikatz的Linux Hash Dump工具
查看>>
CORS协议与Spring注解的冲突
查看>>
nginx fastcgi负载均衡
查看>>
Innodb之线程独享内存
查看>>
Android+Eclipse+Java:在“正在启动 CrazySnake”期间发生了内部错误, java.lang.NullPointerException...
查看>>
本地远程访问服务器jupyter
查看>>
anaconda下jieba和wordcloud安装
查看>>
57.6174问题
查看>>