dialog close event jquery mobile not working - events

Question

I am working on jQuery mobile dynamic dialog. Everything is working fine except the close event.
$(document).ready(function () {
$('#btnalert').click(function () {
alert('click');
msg('hello', 'info', function () {
alert('call back function');// this line is not called
});
});
});
function msg(_msg, _title, _okCB) {
try {
if (_title == null || _title == undefined || _title == '') {
_title = 'Information';
}
if (_msg == null || _msg == undefined || _msg == '') {
_msg = 'Error found. Please contact your administrator.';
}
// Create it in memory
var dlg = $("<div id=\"dlgAlert\" class=\"ui-corner-all ui-shadow\" data-close-btn=\"right\" />")
.attr("data-role", "dialog")
.attr("id", "dialog");
var header = $("<div />")
.attr("data-role", "header")
.attr("role", "banner")
.html("<h2>" + _title + "</h2>");
var content = $("<div style=\"padding: 15px;\" />")
.attr("data-role", "content")
.append($("<p />").html(_msg));
content.append("<div ><a class='dlgalert' href='#index' data-rel='back' data-role=\"button\" data-theme=\"c\" >Close</a></div>");
dlg.append(header).trigger('create');
dlg.append(content).trigger('create');
dlg.appendTo($.mobile.pageContainer);
$.mobile.changePage(dlg, {
transition: "pop",
role: "dialog",
reverse: false
});
} catch (e) {
alert(e);
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" rel="stylesheet"/>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<a id="btnalert" data-role="button"> alert</a>

Answer 1

add below code in your function . check here DEMO
dialogs are simply pages which display dialogs . so here you can call pagehide event.
dlg.on("pagehide",function(){
alert("Dialog closed");
});
or check DEMO
dlg.off("pagehide").on("pagehide",function(){
alert("Dialog closed");
});