对于常见的一个普通窗口,可以用以下的方式进行弹出窗口和获取选中的datagrid中的row
function chooseXxx() {
var dia = top.sy.iframeDialog({
id:'u_frame',
title : '示例标题',
height: $(top).height() * 0.8,
width: $(top).width() * 0.8,
href : "xx/chooseXxxPage" //弹出窗口的请求url
,buttons:[{
text:'确定',
handler:function() {
var win=dia.find("iframe")[0].contentWindow;
var row=win.$("#datagrid").datagrid("getSelected");
if (null == row) {
top.$.messager.alert('请先选择一条记录。');
} else {
dia.dialog("close"); //关闭窗口
//根据需要进行获取元素和设置值
$("#xxName").val(row.name);
$("#xxAge").val(row.age);
}
}
},{
text:'关闭',
handler:function(){
dia.dialog('close');
}
}]
});
}
}
如果对于弹窗的页面是有多个页签的, 也就是iframe. 如下图. 这些页签一般企业中会做成可配置的.父的iframe中嵌套着子iframe,其中子iframe个数不定
<body>
<div class="easyui-tabs" fit="true" id="mytabs" data-options="onSelect:myTabsOnselect">
<c:forEach items="${pageMenuFuns }" var="p">
<div title="${p.name}" style="">
<iframe src="" style="width:100%;height:99%;border: 0" frameborder="0" myHref="${p.href}"></iframe>
</div>
</c:forEach>
</div>
<script>
function myTabsOnselect(title, index) {
var myIframe = $(this).tabs('getTab', index).find('iframe');
if (!myIframe.attr('src')) myIframe.attr('src', myIframe.attr('myHref'));
}
</script>
</body>
对于这种情况,则需要如下的处理
function chooseXxx(){
var w = $(top).width() - 100;
var h = $(top).height() - 70;
var dia = top.sy.iframeDialog({
title: "示例标题", width: w, height: h,
href: "xx/chooseXxxPage",
buttons: [{
text: "确定", handler: function () {
var win ;
var frames =dia.find("iframe").contents().find("iframe");
$.each(frames,function (index, ele) {
//获取选中的iframe,具体可以通过f12调试查看选中页签时发生更改的css
if($(ele).parent().parent().css("display") == "block"){
win = ele.contentWindow;
}
});
var row = win.$("#datagrid").datagrid("getSelected");
if (!row) {
alert("请选择一行数据!");
return;
}
setCustomUnit(row)
dia.dialog("close");
}
}, {
text: "关闭", handler: function () {
dia.dialog("close")
}
}]
});
}
这种父子的iframe使用, 具体每个地方设计的不一样. 故对应的js获取方式也有所不同. 应结合实际考虑
到此结束.