Is it possible to call a child.jsp as a model using JavaScript? I previously accessed the child jsp using showmodaldialog and window.open() with JavaScript, but it opens in another window. I want the child jsp to appear in a modal or overlay view. Can someone help me solve this issue? Thank you in advance.
When calling the function showModDilog(), I want the child jsp to appear in a modal or overlay view with updated values.
Alternatively, I can include the child.jsp inside the body using
(<%@include file="child.jsp" %>)*If more information is needed, please feel free to comment. Your assistance is greatly appreciated.
//function to call child.jsp from Parent.jsp
function showModDilog(retVal,curVal,curRow,varPreVal)
{
var varRetVal = retVal;
var varCurrentValue = curVal;
var varCurrentRow = curRow;
var varPreValue = varPreVal;
qsUrl ="../FOLDER/ContentShowModalDialog.do?title="+"ORDER NO - "+varRetVal+" ALREADY EXISTS &varCurrentValue="+varCurrentValue+"&varCurrentRow="+varCurrentRow+"&varPreValue="+varPreValue;
if(navigator.appName =='Microsoft Internet Explorer')
{
event.keyCode=0;
}
else
{
event.which=0;
}
event.returnValue=0;
if(getBrowser()=='IE')
{
var qsheight ='200';
var args = new Object;
args.window = window;
returnval = showModalDialog(qsUrl, args);
}
else
{
var args = new Object;
args.window = window.opener;
returnval = window.open(qsUrl, args);
}
}
.css used inside child jsp
.windowModal {
width: 400px;
position: relative;
margin: 10% auto;
padding: 5px 20px 13px 20px;
border-radius: 10px;
background: #fff;
background: -moz-linear-gradient(#fff, #999);
background: -webkit-linear-gradient(#fff, #999);
background: -o-linear-gradient(#fff, #999);
}
.windowModal:target {
opacity:1;
pointer-events: auto;
}
.close {
background: #606061;
color: #FFFFFF;
line-height: 25px;
position: absolute;
right: 5px;
text-align: center;
top: 4px;
width: 24px;
text-decoration: none;
font-weight: bold;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;
-moz-box-shadow: 1px 1px 3px #000;
-webkit-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
}
.close:hover { background: #00d9ff; }
HTML used inside child jsp
<body class="windowModal" bgcolor="#FFCC99">
<div class=" close" style="width: 100%;overflow: auto;height: 100%;background-color: #F0E68C;">
<div style="margin-top: 1%;">
<input type="button" class="close" name="Close" value="X" style="width:8%" onclick="winClose();" >
<label class="labelbold" style="font-weight: bold; float:left;">NAME - </label>
</div>
</div>
</body>