Thanks Sandeep, you have shown me a way to find the workaround for my issue.
Folks, I have created a workaround for my modal dialog issue. However, it is not the exact alternative to ShowModalDialog() but can be used as a good workaround.
Step:1
Add the JQuery UI files into your include directory
Step:2
Add following code to include JQuery UI files into your parent page from where you want to open the modal dialog.
<link rel="stylesheet" href="jquery-ui-1.8.21/themes/base/jquery.ui.all.css">
<script src="jquery-ui-1.8.21/jquery-1.7.2.js"></script>
<script src="jquery-ui-1.8.21/ui/jquery.ui.core.js"></script>
<script src="jquery-ui-1.8.21/ui/jquery.ui.widget.js"></script>
<script src="jquery-ui-1.8.21/ui/jquery.ui.button.js"></script>
<script src="jquery-ui-1.8.21/ui/jquery.ui.position.js"></script>
<script src="jquery-ui-1.8.21/ui/jquery.ui.dialog.js"></script>
<script language="JavaScript" type="text/javascript" src="_include/YesNo.js"></script>
//on click event on parent page or any function from where you want to open popup
//page, add following code.
GetPopUp();
Step:3
Create file YesNo.js by pasting the below code in a text file.
$(function() {
var divTag = document.createElement("div");
divTag.id = "dialog-form";
divTag.title="Test Pop-Up";
document.body.appendChild(divTag);
var p = document.createElement("p");
p.id="msg";
p.innerHTML=<Your custom message>;
document.getElementById("dialog-form").appendChild(p);
var option;
$( "#dialog:ui-dialog" ).dialog( "destroy" );
$( "#dialog-form" ).dialog({
autoOpen: false,
height: 300,
width: 350,
modal: true,
buttons: {
"Yes": function() {
var bValid = true;
if ( bValid ) {
option="True";
$( this ).dialog( "close" );
}
},
"No": function() {
option="False";
$( this ).dialog( "close" );
}
},
close: function() {
}
});
});
function GetPopUp()
{
$( "#dialog-form" ).dialog( "open" );
}
I hope, it helps for other coders who are facing this issue.
Thanks