Problem
Redirecting to another page from the SP.UI.ModalDialog Modal window without closing the window will not work and it always opens a new modeless window where the page will be displayed. The dialog framework supports the Source=url querystring variable like the rest of SharePoint. But this has to be part of the Dialog Options to redirect to another page. However, if you have a requirement to dynamically get the page which needs to be redirected from the dialog then this may create a problem…
Solution
The solution for the problem would be to create an intermediate html page. This would have a <frameset> html element with a single frame and set the src attribute with the page which you actually need to load inside the Modal Dialog. So now if the user clicks the link which navigates to another page, it will be opened within the same dialog window instead of a new window. Here’s how it works…
Let me explain the implementation method using the example below.
Solution Implementation
Create an HTML/ASPX Page
Create an html/aspx page and place it in the _layouts folder or your respective folder. (Copy and paste the below code.)
<frameset rows="100%">
<frame src="<<replace the actual filename here>>">
</frameset>
In the above code please replace the filename with the actual page which you want the modal dialog to load.
JavaScript function to invoke the html or aspx page
<script type="text/javascript">
//Dialog opening
function OpenDialog() {
var options = SP.UI.$create_DialogOptions();
options.url = "<<replace frameset filename here>>";
options.width = 500;
options.height = 400;
options.dialogReturnValueCallback = Function.createDelegate(null, CloseCallback);
SP.UI.ModalDialog.showModalDialog(options);
}
var messageId;
// Dialog callback
function CloseCallback(result, target) {
if(result === SP.UI.DialogResult.OK) {
SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.OK);
}
if(result === SP.UI.DialogResult.cancel) {
SP.UI.Notify.addNotification("Operation was cancelled...", false, "", null);
}
}
</script>
Screen shot of the sample implementation
In the above shown screen shot the “View Results” link will load the poll results page within the same window.
Next Steps
- Check out these other SharePoint tips
Udayakumar Mathivanan was born on January 10th (year is highly secret, he is afraid that it may lead to the lose of some of his girlfriends) in Tamilnadu, India. His all-time male role model Bill Gates was an inspiration while Udayakumar was growing up, but he didn’t let that stop him from achieving his goals. He was especially interested in Computer System Programming, Graphics and Gaming oriented development. Luckily, his parents encouraged those interests. That encouragement drove him to excel. He graduated from high school at 16! Then he earned degrees in computer science engineering and later got settled in the IT industry and started his career as a Software Engineer. Soon after, no obstacle was too great for Uday to overcome!
Uday’s accomplishments did not end there he thought .NET and SharePoint would be a revolution in the industry and started to prepare for the invaluable certifications from Microsoft which is most highly regarded in the software industry. Currently he has MCP and MCTS certifications on .NET and SharePoint technologies including the latest SharePoint 2010. He is presently working as a SharePoint Architect for Symphony Services and works with several reputed clients across the world including some of the giants like Sony, JP Morgan, Infosys and Microsoft. He thinks knowledge is not something which somebody owns; instead it should be spread and shared with others. He also has a blog (http://bestofcyber.wordpress.com) and writes articles on SharePoint and .NET along with other Microsoft technologies. He is an active member of the Bangalore .NET user group (http://bdotnet.com) and writes lots of articles. He is also an active member of TechNet and MSDN forums.