function queryRelation(tableID,prosourceID){ //弹出页面 debugger; initqueryRelationGrid(tableID,prosourceID); var setting = { xType: "dialog", id: "queryRelationDiv", title: "对应关系", content: $("#queryRelationGridDiv"), button : [/*{ name: "确定", handler: function(){ } },*/{ name: "关闭", handler: function(){ document.getElementById("queryRelationGridDiv").parentNode.removeChild(document.getElementById("queryRelationGridDiv")); Hq.getCmp("queryRelationDiv").close(); } }], width: '800px', height: '700px', maxFlag: false, minFlag: false, showMin : true, style: "white", logoIMG: "static/pub2.0/themes/flatblue/dialog/images/logo_ico.png", isModel: true, isDrag: true, isResize: false, closeFn: function() { document.getElementById("queryRelationGridDiv").parentNode.removeChild(document.getElementById("queryRelationGridDiv")); Hq.getCmp("queryRelationDiv").close(); } }; Hq.create(setting);}function initqueryRelationGrid(tableID,prosourceID){ //初始化div debugger; if(document.getElementById("queryRelationGridDiv")==null){ $(document.body).append('<div id="queryRelationGridDiv"><div>'); } $.ajax({ url:"exp/dialogset/set/getRelation.do?tableID="+tableID+"&prosourceID="+prosourceID+"&tokenid="+tokenID, type:"get", cache:false,//设置浏览器不缓存页面 beforeSend:function(){ return true; }, success:function(jsonObject){ debugger; var shtml = "<table id='relationTable' cellpadding='3' cellspacing='1' bgcolor='#a1a1a1' width='100%'>"; //style='background-color: rgb(213, 229, 253); shtml+="<tr style='background-color: rgb(149, 205, 255)' height='24px'><td width='4%' align='center'>序号</td> <td width='30%' align='center'>表列名</td><td width='30%' align='center'>项目源列名</td><td width='30%' align='center'>操作列</td></tr>"; for(var a = 0 ; a<jsonObject.length ; a++){ shtml+="<tr id='"+jsonObject[0].id+"' οnmοuseοver='changeRowOverColor(this)' οnmοuseοut='changeRowOutColor(this)' style='background-color: rgb(213, 229, 253)'height='20px'>"; shtml+="<td width='4%' align='center'>"+(a+1)+"</td>"; shtml+="<td width='30%'>"+jsonObject[a].colname+"</td>"; shtml+="<td width='30%'>"+jsonObject[a].procolname+"</td>"; shtml+="<td width='30%' align='center'><button type='button' style='background-color:rgb(149, 205, 255);padding:0 20px 0 20px' οnclick='deleteRelation(\""+jsonObject[0].id+"\",\""+tableID+"\",\""+prosourceID+"\")'>删除</button></td>"; shtml+="</tr>"; } shtml+="</table>"; debugger; document.getElementById("queryRelationGridDiv").innerHTML+=shtml; } })};function deleteRelation(id,tableID,prosourceID){ //删除 Hq.Msg.confirm("您确定要删除这条对应关系吗?",function(){ $.ajax({ url:"exp/dialogset/set/deleteRelation.do?id="+id+"&tokenid="+tokenID, type:"get", cache:false, beforeSend:function(){ }, success:function(jsonObject){ debugger; var msg=jsonObject.msg; alert(msg); document.getElementById("queryRelationGridDiv").removeChild(document.getElementById("relationTable")); initqueryRelationGrid(tableID,prosourceID); } }) });
}function changeRowOverColor(row){ //鼠标覆盖背景色 row.style.backgroundColor='rgb(255, 253, 217)';}function changeRowOutColor(row){ row.style.backgroundColor='rgb(213, 229, 253)';}
转载于:https://www.cnblogs.com/sx2zx/p/6694603.html
相关资源：js弹出层table运用