Open any page as modal Pop up in Sharepoint 2010

Often we come across requirements where we are asked to open a page as Modal popup in SharePoint 2010. There are multiple benefits of using Modal Popups:

1. Gives your site a uniformity
2. External sites and forms can be browsed without user actually leaving your site

To open a site as modal popup, you can reuse the code used by SharePoint itself. Just call the following functional in the event where you want to open the Popup.

NewItem2(event, http://www.targetsite.com/);javascript:return false;

In the example below, I have opened an external site on the click event of a link.

< a onclick="javascript:NewItem2(event,& quot;http://www.targetsite.com/&quot;); javascript:return false;" href="http://www.targetsite.com/" target="_self">Target page</a>

In the above example, if you have the value of URL in href property of the anchor tag you can also use the HTML as below

< a onclick="javascript:NewItem2(event,this.href); javascript:return false;" href="http://www.targetsite.com/" target="_self">Target page</a>

But make sure that you use 'return false'.

Alternatively, if you want to modify the size of the popup or add any more functionality in the PopUp, you can create a new function similar to the below:

function ModalPopUpSP2010(url)
{
var NewPopUp = SP.UI.$create_DialogOptions();
ModalPopUp.url = URL;
ModalPopUp.width = 800;
ModalPopUp.height = 400;
SP.UI.ModalDialog.showModalDialog(ModalPopUp);
}

And call this function as

< a onclick="javascript:ModalPopUpSP2010(‘http://www.targetsite.com/’)" href="http://www.targetsite.com/" target="_self">Target page</a>