關於獲取彈出的子視窗中datagrid選中的值
阿新 • • 發佈：2018-12-21
對於常見的一個普通視窗,可以用以下的方式進行彈出視窗和獲取選中的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獲取方式也有所不同. 應結合實際考慮
到此結束.