Blocking parent dialog box and background
I have a dialog box inside another one, as I click on a button in main dialog box the second one open up. I am using jQuery dialog box. I want to disable background content including the parent dialog box. I have used `model:true` but it doesn't disable parent dialog box it disables only the background content where the parent dialog box opened.
Please help to resolve this issue..
Here is my code :
jQuery:
$(".showEmployee").click(function(){
$("#employee").dialog({
dialogClass: 'ui-dialog-grey',
autoOpen: false,
resizable: false,
minWidth: 1200,
maxWidth: 1200,
fluid: true,
modal: true,
buttons: [
"text" : edit,
click: function() {
}
]
});
$.ajax({
type: "POST",
url: "/showemployee.do",
success: function(response) {
$("#data").html(response);
$( "#employee" ).dialog( "open" );
$('.ui-dialog button').blur();
$("#employee").css("background-color","#FFFFFF");
$(".ui-widget-content").css("background-color","#FFFFFF");
$(".ui-dialog").css("background-color","#FFFFFF");
}
});
});
function edtNow() {
- $.ajax({
type: "POST",
url: "/editemployee.do,
success: function(response) {
$("#editscreen").html(response);
$("#editscreenDialog" ).dialog({
dialogClass: 'ui-dialog-grey',
autoOpen: false,
resizable: false,
minWidth: 600,
maxWidth: 600,
fluid: true,
modal : true,
show : {
effect : "blind",
duration: 500
},
hide : {
effect : explode",
duration: 500
},
buttons : []
});
$("#editscreenDialog").dialog( "open" );
$('.ui-dialog button').blur();
$("#editscreenDialog").css("background-color","#FFFFFF");
$(".ui-widget-content").css("background-color","#FFFFFF");
$(".ui-dialog").css("background-color","#FFFFFF");
}
});
}
Any help or opinion is appreciated.
Thanks in advance