Hint: Closing MochaUI window from iframe without knowing window ID

In this post I want to tell you how you can solve problem with closing MochaUI Window object without knowing its ID. First, little sample of window creation:

PMWare.Dialogs.sendMail = function() {
 new MochaUI.Window({
     icon: '/images/icons/01/16/04.png',
     title: 'Compose Message',
     resizable: false,
     loadMethod: 'iframe',
     contentURL: '/members/Utils/dialog.sendmail.aspx',
     width: 520,
     height: 395
 });
};

In my case, when I call PMWare.Dialogs.sendMail() it creates new MochaUI window, as you can see there is no ID specified in window options, so i can have tons of these windows on the workspace and have no confusion for my DOM. When there is no ID specified, MochaUI does ID generation, like win1, win2, win3 and so on.

To close window programmatically via JavaScript you need to know its ID; MochaUI.closeWindow(windowEl) requires windowEl parameter that refers to window object, in your case you never know the ID of window so you can’t get window instance directly, so you have to work it out in own way.

When you set your window to load content into iframe, MochaUI continues to generate IDs, so you don’t need to worry about how things organized in DOM level. When window loads content into iframe, this iframe as ID like windowID_iframe, that does pretty good job for us, because we can parse it this way:

function getwindowId() {
 return window.frameElement.id.split("_")[0];
}

Now you can have ID of your window object, so next thing you can do is close the window as you wanted:

parent.MochaUI.closeWindow(parent.document.getElementById(getwindowId()));