jQuery MiniUI

标题: 请问 Inline DetailGrid [打印本页]

作者: wslfriend 时间: 2013-11-6 17:54:48 标题: 请问 Inline DetailGrid

Inline DetailGrid 既然不能同时打开多个子项，那么子项信息改动、追加后，提交该怎么办呢？
这是个很常见的功能啊

能否借鉴Tab 载入 iframe 的样例，将子项grid 放在另外个 html 中，以实现全部展开、随意编辑的效果呢？

作者: wslfriend 时间: 2013-11-6 17:55:53

http://www.miniui.com/demo/#src=datagrid/rowdetail.html

这个例子中可以随意展开，那将td 中的信息，改换成iframe 不行么？

作者: factory 时间: 2013-11-6 18:04:26

http://www.miniui.com/demo/#src=datagrid/inline_detailform.html

参考这个提交

作者: wslfriend 时间: 2013-11-6 18:08:55

这个估计够呛。

肯定是整个表单提交，而非单行提交。。。。

作者: wslfriend 时间: 2013-11-6 18:13:41

autoHideRowDetail="false" 设置了这个之后，貌似可以都显示。。。

难题就在于，datagrid 要么new 出来，要么 iframe 嵌套出来。。。。

作者: factory 时间: 2013-11-6 18:14:41

wslfriend 发表于 2013-11-6 18:08
这个估计够呛。

肯定是整个表单提交，而非单行提交。。。。

不是啊，这个form代表着的就是这一行对应的详细信息，一个表单数据，对应的是一条数据，他的数据不是数组，不是对应多条

作者: wslfriend 时间: 2013-11-6 18:19:11

factory 发表于 2013-11-6 18:04
http://www.miniui.com/demo/#src=datagrid/inline_detailform.html

参考这个提交

你这个DEMO 无法实现展开多个？

作者: wslfriend 时间: 2013-11-6 18:22:49

另外，我尝试了下
<script id="formTemplate" type="text/x-jquery-tmpl">
<Iframe src="......"> </iframe>
</script>

autoHideRowDetail="false" 设置为false ,貌似能实现显示效果，就是异步加载不太爽。
提交如何接收信息尚未研究。
--------------------------------------------------------------------------------------------------------------
<script id="formTemplate" type="text/x-jquery-tmpl">
<div class="mini-datagrid".....></div>
</script>
完全不显示，不知为何

作者: factory 时间: 2013-11-7 09:28:52

wslfriend 发表于 2013-11-6 18:22
另外，我尝试了下

grid不一样,他是用HTML标签化写的.他被一个对象被添加到主表的行下面之后,其他行是再同时显示的,因为他只有一个表格对象.所以跟你上面贴的例子有区别.所以inline_detalgrid,只能同时展开一条记录

作者: wslfriend 时间: 2013-11-7 09:44:53

inline_detalgrid
同时展开、编辑多个域，是很常见普遍的需求啊

真要不能实现，也建议贵公司能否想想其他辙？
这个需求在业务偏复杂的场景下，几乎是遍地开花无处不在

作者: factory 时间: 2013-11-7 11:27:51

wslfriend 发表于 2013-11-7 09:44
inline_detalgrid
同时展开、编辑多个域，是很常见普遍的需求啊

[attach]3140[/attach]看这个例子

因为表格结构复杂,当你多行数据展开多个表格的时候,机器性能差点的,页面可能会卡,我们不建议客户把行全部展开的原因,就是这个
如果需要全部展开,那你不能参考在线demo,只能一个个去创建多个表格.

作者: wslfriend 时间: 2013-11-7 13:58:51

我晕，我是想实现点开多个“+” ，能同时看到各自子项。。。。
您这DEMO ，依旧是只能看到一个"+" 下的内容。。。。

折腾一上午，实现了这功能，采用模板方式，
<script id="formTemplate" type="text/x-jquery-tmpl">
<iframe src="${PropertyUrl}" frameborder="0" scrolling="no" style="width:100%;height:250px;margin-left:40px" ></iframe>
</script>

grid.autoHideRowDetail="false"；

每个iframe.url 中，top[是动态值] ....

最后实现了新增操作。
[attach]3142[/attach]

作者: factory 时间: 2013-11-7 14:03:42

wslfriend 发表于 2013-11-7 13:58
我晕，我是想实现点开多个“+” ，能同时看到各自子项。。。。
您这DEMO ，依旧是只能看到一个"+" 下的内容 ...

我给你的例子,不就是各自行下面的表格,加载各自的对应子数据吗?

作者: wslfriend 时间: 2013-11-7 14:14:05

非也，非也。。。

[attach]3144[/attach]

作者: wslfriend 时间: 2013-11-7 17:25:10

还有个问题，请教一下，

datagrid.onshowrowdetail  事件中
  function onShowPropertyList(e) {
         var grid = e.sender;
         var row = e.record;
         if (grid.isShowRowDetail(row) == false) return;  //如果已经展开了，则不再继续
         var td = grid.getRowDetailCellEl(row); td 可以取到值

}

但是，点击新增按钮，添加一行，就无法取到td 的值了
onclick()
{
   mini.get("gdTableList").addRow(row);
                     var td = mini.get("gdTableList").getRowDetailCellEl(row);
                     alert(td);   //  undefined  无法取到值，请问该怎么取？
}

请问如何点击新增按钮时，取到  getRowDetailCellEl(row) 的值

作者: factory 时间: 2013-11-7 17:37:54

wslfriend 发表于 2013-11-7 17:25
还有个问题，请教一下，

datagrid.onshowrowdetail 事件中

必须在展开的时候才会有,没有展开动作,是不会帮你创建的,不然会增加性能

参考我的例子,监听onshowrowdetail
在展开的时候,再去创建

作者: wslfriend 时间: 2013-11-7 17:55:27

本帖最后由 wslfriend 于 2013-11-7 18:11 编辑

factory 发表于 2013-11-7 17:37
必须在展开的时候才会有,没有展开动作,是不会帮你创建的,不然会增加性能

参考我的例子,监听onshowrowdet ...

谢谢Factory 了。。。。

九牛二虎之力，全部搞定了

不过还有个隐患，因为我做的是导入操作，如果人家选好表之后，不展开则无法获取到对应FieldList。。。。

会导致新增的信息不全。还非得迫使别人手工展开不可。

呵呵，瑕不掩瑜，这程度完全可用了。。。。
再次感谢

作者: factory 时间: 2013-11-7 19:09:13

wslfriend 发表于 2013-11-7 17:55
谢谢Factory 了。。。。

九牛二虎之力，全部搞定了

有方法可以用代码展开的
grid.showRowDetail(row)
在你需要获取detailEl的时候，执行下这个，让他展开

作者: wslfriend 时间: 2013-11-8 11:20:10

factory 发表于 2013-11-7 19:09
有方法可以用代码展开的
grid.showRowDetail(row)
在你需要获取detailEl的时候，执行下这个，让他展开 ...

哈哈，这下真的完美了。。。。

作者: wslfriend 时间: 2013-11-11 04:18:32

哈哈，又碰到新问题了，请先看图
[attach]3165[/attach]

孙表改动，但子表未改。

请问grid 中的数据状态，除了 added/modified/removed 之外，是否应该再添加个“被动修改”或者“被动提交" 的状态呢？

其实，表单中的信息结构，从更严谨的角度看，应该设计为无限层级的”树形结构“，而非简单的”父子结构“。。。。

作者: factory 时间: 2013-11-11 09:47:19

wslfriend 发表于 2013-11-11 04:18
哈哈，又碰到新问题了，请先看图

因为内嵌子表是客户自己创建的,所以我们没法设置标准化的通用API.
你可以在你创建内嵌子表的时候,给主表行和内嵌子表有个约定,通过内嵌子表的id和行的唯一标识字段
你看下下面的代码

//生成子表格的时候，约定一个id
row.subid = "subgrid"+new Date().getTime();
subgrid.setId(row.subid);
//点击保存的时候，遍历主表，找子表
var data = [];
var rows = grid.getData();
for(var i=0,l=rows.length; i<l; i++){
var row = rows[i];
var subgrid = mini.get(row.subid);
if(!subgrid) continue;
//获得子表的改动数据
var changes = subgrid.getChanges();
data.addRange(changes);
...
}
var json = mini.encode(data);//一次性提交所有子表变更数据

复制代码

作者: wslfriend 时间: 2013-11-11 12:13:59

factory 发表于 2013-11-11 09:47
因为内嵌子表是客户自己创建的,所以我们没法设置标准化的通用API.
你可以在你创建内嵌子表的时候,给主表 ...

这段代码很有启发意义，谢谢了。。。

前文所述问题，我用脚本方式搞定了，子表改动后触发父表 row._state = "modified" 。

暂时算OK了吧。

欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)