easyui中在tab中弹出窗口后，如何更新tab中datagrid组件

Question

最近通过easyui做系统，但是发现有个问题，问题描述如下：先上个图

布局是通过easyui的布局，角色管理tab里面的内容是通过iframe创建的，添加角色弹出窗口里面也是通过iframe创建的，脚本如下：

function showWindow(title, href, width, height, modal, minimizable, maximizable) {
	var openWin = window.top.$('<div id="myWinId" class="easyui-window" closed="true"></div>').appendTo(window.top.document.body);
	//var openWin = $('<div id="myWinId" class="easyui-window" closed="true"></div>').appendTo(document.body);
	openWin.window({
        title: title,
        width: width === undefined ? 600 : width,
        height: height === undefined ? 400 : height,
        content: '<iframe scrolling="no" frameborder="0"  src="' + href + '" style="width:100%;height:99%;"></iframe>',
        //href: href === undefined ? null : href,
        modal: modal === undefined ? true : modal,
        minimizable: minimizable === undefined ? false : minimizable,
        maximizable: maximizable === undefined ? false : maximizable,
        shadow: false,
        cache: false,
        closed: false,
        collapsible: false,
        resizable: false,
        loadingMessage: '正在加载数据，请稍等片刻......',
        onClose : function(){ 
        	openWin.window("destroy"); 
        } 
    });
}

点击提交按钮后，数据保存成功，但是向刷新标签页中的datagrid，我尝试了很多方法都没有成功，请问如何解决？

Answer 1

这么多年了 解决了嘛?我也要

Answer 2

添加页面的代码
function reloadData(){
    	   var tab = parent.$('#tabs').tabs('getSelected');
   		   var ifram = tab.find('iframe')[0];
   		   ifram.contentWindow.reloadGrid();
       }

列表页面的代码
function reloadGrid(){
    	   $("#userTable").datagrid("reload");
       }

 

Answer 3

@boyce小布     每个页面里都引入这段代码

var Frame = {};

Frame.openDialog = function(url, title, width, height,colseEvent) {
	window.parent.openDialog(url, title, width, height,colseEvent);
};

function openDialog(url, title, width, height,colseEvent) {
	if (title == null)
		title == "";
	if (width == null) {
		var _w = document.body.clientWidth;
		width = _w * 0.9;
	}
	if (height == null) {
		var _h = document.body.clientHeight;
		height = _h * 0.9;
	}
	$('#frame-dialog').dialog({
		width : width,
		height : height,
		modal : true,
		title : title,
		maximizable : true,
        	cache:false,
		href : url,
        onClose:colseEvent
	});
}

Demo

Frame.openDialog("url?xxxxx","测试页面",500,300,function(){
    //TODO 刷新表格
});

在close事件中去，回调刷新

Answer 4

楼主解决了吗？我也搞不定了，就是能获取iframe的对象，娶不到iframe里的datagrid 对象

Answer 5

问题是window是top顶层弹出，close时无法刷新子iframe中的datagrid，有什么好的解决方法吗

Answer 6

给
showWindow方法加一个参数，callback事件，在window的onClose中执行。在callback事件中刷新表格，这个callback事件就跟你的表格在一个页面中了

Answer 7

你问题解决了吗？我也遇到相同的问题！可以告诉我怎么做吗？

Answer 8

哦，那你再找其他方法吧。。呵呵

Answer 9

我试过了，不行。parent.done() 可以调用父页面的函数，但实际上调用主页面的函数，不是tab页面中的函数。

Answer 10

也就无法刷新datagrid。

Answer 11

我读了一遍，也不知道我理解的对不对。如果不对你可以直接忽略。

如果是在一个页面中使用iframe，需要在iframe刷新或者调用父页面中的组件，可以在父页面中定义一个函数done（）  ，以你的需求为例，就是你在父页面（相对于你弹出的iframe而言的），然后在你处理添加操作的controller中返回 类似这样的语句

outputResult("<script>parent.done()</script>"); done这个函数你可以自定义的。。

试试看吧。如果不行就只能再找别的方法了。