Skip to main content
Stack Overflow
  1. About
  2. For Teams

Return to Answer

deleted 60 characters in body
Source Link
John Weisz
  • 32.2k
  • 14
  • 97
  • 139

Modal Window using ExtJS approach.

In Main Window

<html>
<link rel="stylesheet" href="ext.css" type="text/css">
<head> 
<script type="text/javascript" src="ext-all.js"></script>
function openModalDialog() {
 Ext.onReady(function() {
 Ext.create('Ext.window.Window', {
 title: 'Hello',
 height: Ext.getBody().getViewSize().height*0.8,
 width: Ext.getBody().getViewSize().width*0.8,
 minWidth:'730',
 minHeight:'450',
 layout: 'fit',
 itemId : 'popUpWin', 
 modal:true,
 shadow:false,
 resizable:true,
 constrainHeader:true,
 items: [{
 xtype: 'box',
 autoEl: {
 tag: 'iframe',
 src: '2.html',
 frameBorder:'0'
 }
 }]
 }).show();
 });
}
function closeExtWin(isSubmit) {
 Ext.ComponentQuery.query('#popUpWin')[0].close();
 if (isSubmit) {
 document.forms[0].userAction.value = "refresh";
 document.forms[0].submit();
 }
}
</head>
<body>
 <form action="abc.jsp">
 <a href="javascript:openModalDialog()"> Click to open dialog </a>
 </form>
</body>
</html>

In popupWindow 2.html

<html>
<head>
<script type="text\javascript">
function doSubmit(action) {
<!-- if I don't write this I can't suggest my edit -->
 if (action == 'save') {
 window.parent.closeExtWin(true);
 } else {
 window.parent.closeExtWin(false);
 } 
}
</script>
</head>
<body>
 <a href="javascript:doSubmit('save');" title="Save">Save</a>
 <a href="javascript:doSubmit('cancel');" title="Cancel">Cancel</a>
</body>
</html>

Modal Window using ExtJS approach.

In Main Window

<html>
<link rel="stylesheet" href="ext.css" type="text/css">
<head> 
<script type="text/javascript" src="ext-all.js"></script>
function openModalDialog() {
 Ext.onReady(function() {
 Ext.create('Ext.window.Window', {
 title: 'Hello',
 height: Ext.getBody().getViewSize().height*0.8,
 width: Ext.getBody().getViewSize().width*0.8,
 minWidth:'730',
 minHeight:'450',
 layout: 'fit',
 itemId : 'popUpWin', 
 modal:true,
 shadow:false,
 resizable:true,
 constrainHeader:true,
 items: [{
 xtype: 'box',
 autoEl: {
 tag: 'iframe',
 src: '2.html',
 frameBorder:'0'
 }
 }]
 }).show();
 });
}
function closeExtWin(isSubmit) {
 Ext.ComponentQuery.query('#popUpWin')[0].close();
 if (isSubmit) {
 document.forms[0].userAction.value = "refresh";
 document.forms[0].submit();
 }
}
</head>
<body>
 <form action="abc.jsp">
 <a href="javascript:openModalDialog()"> Click to open dialog </a>
 </form>
</body>
</html>

In popupWindow 2.html

<html>
<head>
<script type="text\javascript">
function doSubmit(action) {
<!-- if I don't write this I can't suggest my edit -->
 if (action == 'save') {
 window.parent.closeExtWin(true);
 } else {
 window.parent.closeExtWin(false);
 } 
}
</script>
</head>
<body>
 <a href="javascript:doSubmit('save');" title="Save">Save</a>
 <a href="javascript:doSubmit('cancel');" title="Cancel">Cancel</a>
</body>
</html>

Modal Window using ExtJS approach.

In Main Window

<html>
<link rel="stylesheet" href="ext.css" type="text/css">
<head> 
<script type="text/javascript" src="ext-all.js"></script>
function openModalDialog() {
 Ext.onReady(function() {
 Ext.create('Ext.window.Window', {
 title: 'Hello',
 height: Ext.getBody().getViewSize().height*0.8,
 width: Ext.getBody().getViewSize().width*0.8,
 minWidth:'730',
 minHeight:'450',
 layout: 'fit',
 itemId : 'popUpWin', 
 modal:true,
 shadow:false,
 resizable:true,
 constrainHeader:true,
 items: [{
 xtype: 'box',
 autoEl: {
 tag: 'iframe',
 src: '2.html',
 frameBorder:'0'
 }
 }]
 }).show();
 });
}
function closeExtWin(isSubmit) {
 Ext.ComponentQuery.query('#popUpWin')[0].close();
 if (isSubmit) {
 document.forms[0].userAction.value = "refresh";
 document.forms[0].submit();
 }
}
</head>
<body>
 <form action="abc.jsp">
 <a href="javascript:openModalDialog()"> Click to open dialog </a>
 </form>
</body>
</html>

In popupWindow 2.html

<html>
<head>
<script type="text\javascript">
function doSubmit(action) {
 if (action == 'save') {
 window.parent.closeExtWin(true);
 } else {
 window.parent.closeExtWin(false);
 } 
}
</script>
</head>
<body>
 <a href="javascript:doSubmit('save');" title="Save">Save</a>
 <a href="javascript:doSubmit('cancel');" title="Cancel">Cancel</a>
</body>
</html>

Modal Window using ExtJS approach.

In Main Window

<html>
<link rel="stylesheet" href="ext.css" type="text/css">
<head> 
<script type="text/javascript" src="ext-all.js"></script>
function openModalDialog() {
 Ext.onReady(function() {
 Ext.create('Ext.window.Window', {
 title: 'Hello',
 height: Ext.getBody().getViewSize().height*0.8,
 width: Ext.getBody().getViewSize().width*0.8,
 minWidth:'730',
 minHeight:'450',
 layout: 'fit',
 itemId : 'popUpWin', 
 modal:true,
 shadow:false,
 resizable:true,
 constrainHeader:true,
 items: [{
 xtype: 'box',
 autoEl: {
 tag: 'iframe',
 src: '2.html',
 frameBorder:'0'
 }
 }]
 }).show();
 });
}
function closeExtWin(isSubmit) {
 Ext.ComponentQuery.query('#popUpWin')[0].close();
 if (isSubmit) {
 document.forms[0].userAction.value = "refresh";
 document.forms[0].submit();
 }
}
</head>
<body>
 <form action="abc.jsp">
 <a href="javascript:openModalDialog()"> Click to open dialog </a>
 </form>
</body>
</html>

In popupWindow 2.html

<html>
<head>
<script type="text\javascript">
function doSubmit(action) {
<!-- if I don't write this I can't suggest my edit -->
 if (action == 'save'save') {
 window.parent.closeExtWin(true);
 } else {
 window.parent.closeExtWin(false);
 } 
}
</script>
</head>
<body>
 <a href="javascript:doSubmit('save');" title="Save">Save</a>
 <a href="javascript:doSubmit('cancel');" title="Cancel">Cancel</a>
</body>
</html>

Modal Window using ExtJS approach.

In Main Window

<html>
<link rel="stylesheet" href="ext.css" type="text/css">
<head> 
<script type="text/javascript" src="ext-all.js"></script>
function openModalDialog() {
 Ext.onReady(function() {
 Ext.create('Ext.window.Window', {
 title: 'Hello',
 height: Ext.getBody().getViewSize().height*0.8,
 width: Ext.getBody().getViewSize().width*0.8,
 minWidth:'730',
 minHeight:'450',
 layout: 'fit',
 itemId : 'popUpWin', 
 modal:true,
 shadow:false,
 resizable:true,
 constrainHeader:true,
 items: [{
 xtype: 'box',
 autoEl: {
 tag: 'iframe',
 src: '2.html',
 frameBorder:'0'
 }
 }]
 }).show();
 });
}
function closeExtWin(isSubmit) {
 Ext.ComponentQuery.query('#popUpWin')[0].close();
 if (isSubmit) {
 document.forms[0].userAction.value = "refresh";
 document.forms[0].submit();
 }
}
</head>
<body>
 <form action="abc.jsp">
 <a href="javascript:openModalDialog()"> Click to open dialog </a>
 </form>
</body>
</html>

In popupWindow 2.html

<html>
<head>
<script type="text\javascript">
function doSubmit(action) {
 if (action == 'save) {
 window.parent.closeExtWin(true);
 } else {
 window.parent.closeExtWin(false);
 } 
}
</script>
</head>
<body>
 <a href="javascript:doSubmit('save');" title="Save">Save</a>
 <a href="javascript:doSubmit('cancel');" title="Cancel">Cancel</a>
</body>
</html>

Modal Window using ExtJS approach.

In Main Window

<html>
<link rel="stylesheet" href="ext.css" type="text/css">
<head> 
<script type="text/javascript" src="ext-all.js"></script>
function openModalDialog() {
 Ext.onReady(function() {
 Ext.create('Ext.window.Window', {
 title: 'Hello',
 height: Ext.getBody().getViewSize().height*0.8,
 width: Ext.getBody().getViewSize().width*0.8,
 minWidth:'730',
 minHeight:'450',
 layout: 'fit',
 itemId : 'popUpWin', 
 modal:true,
 shadow:false,
 resizable:true,
 constrainHeader:true,
 items: [{
 xtype: 'box',
 autoEl: {
 tag: 'iframe',
 src: '2.html',
 frameBorder:'0'
 }
 }]
 }).show();
 });
}
function closeExtWin(isSubmit) {
 Ext.ComponentQuery.query('#popUpWin')[0].close();
 if (isSubmit) {
 document.forms[0].userAction.value = "refresh";
 document.forms[0].submit();
 }
}
</head>
<body>
 <form action="abc.jsp">
 <a href="javascript:openModalDialog()"> Click to open dialog </a>
 </form>
</body>
</html>

In popupWindow 2.html

<html>
<head>
<script type="text\javascript">
function doSubmit(action) {
<!-- if I don't write this I can't suggest my edit -->
 if (action == 'save') {
 window.parent.closeExtWin(true);
 } else {
 window.parent.closeExtWin(false);
 } 
}
</script>
</head>
<body>
 <a href="javascript:doSubmit('save');" title="Save">Save</a>
 <a href="javascript:doSubmit('cancel');" title="Cancel">Cancel</a>
</body>
</html>
Source Link

Modal Window using ExtJS approach.

In Main Window

<html>
<link rel="stylesheet" href="ext.css" type="text/css">
<head> 
<script type="text/javascript" src="ext-all.js"></script>
function openModalDialog() {
 Ext.onReady(function() {
 Ext.create('Ext.window.Window', {
 title: 'Hello',
 height: Ext.getBody().getViewSize().height*0.8,
 width: Ext.getBody().getViewSize().width*0.8,
 minWidth:'730',
 minHeight:'450',
 layout: 'fit',
 itemId : 'popUpWin', 
 modal:true,
 shadow:false,
 resizable:true,
 constrainHeader:true,
 items: [{
 xtype: 'box',
 autoEl: {
 tag: 'iframe',
 src: '2.html',
 frameBorder:'0'
 }
 }]
 }).show();
 });
}
function closeExtWin(isSubmit) {
 Ext.ComponentQuery.query('#popUpWin')[0].close();
 if (isSubmit) {
 document.forms[0].userAction.value = "refresh";
 document.forms[0].submit();
 }
}
</head>
<body>
 <form action="abc.jsp">
 <a href="javascript:openModalDialog()"> Click to open dialog </a>
 </form>
</body>
</html>

In popupWindow 2.html

<html>
<head>
<script type="text\javascript">
function doSubmit(action) {
 if (action == 'save) {
 window.parent.closeExtWin(true);
 } else {
 window.parent.closeExtWin(false);
 } 
}
</script>
</head>
<body>
 <a href="javascript:doSubmit('save');" title="Save">Save</a>
 <a href="javascript:doSubmit('cancel');" title="Cancel">Cancel</a>
</body>
</html>
lang-js

AltStyle によって変換されたページ (->オリジナル) /