Since SharePoint 2010, they introduced the modal dialog. This fancy screen is noticed by many and people start thinking in terms of it. So I got a request to make a new site provisioning system where the user gets a link under site actions which opens in a modal dialog. After some google requests I came up on two sites which could help me. First of all Chankaradeep Chandran posted something about ‘Using the SharePoint 2010 Modal Dialog’. Still I got a problem, how to get those files on SharePoint. So I ended up with the second post from a good friend, Jan Tielens. He posted in March an article about ‘Referencing Javascript files with SharePoint 2010 Custom Actions using ScriptSrc’.
I combined the knowledge and insights of both posts into a solution for my problem. First of all you have to start a Project scoped as Farm Solution since we have to publish files into the Layouts folder. This javascript file can be added into the Layouts Mapped Folder very easy.
1: function google_OpenModalDialog() {
2: var options = SP.UI.$create_DialogOptions();
3: options.width = 500;
4: options.height = 250;
5: options.url = "http://www.google.com/";
6: SP.UI.ModalDialog.showModalDialog(options);
7: }
To publish the file in SharePoint, so you can reference methods of it you have to add a CustomAction.
1: <CustomAction Location="ScriptLink" Sequence="1000"
2: ScriptSrc="PlayingWithSiteActions/OpenModalDialog.js">
3: </CustomAction>
Finally you can add another CustomAction to display a link under Site Actions a reference the javascript method when clicked on it.
1: <CustomAction Id="SiteActionsToolbar" GroupId="SiteActions" Location="Microsoft.SharePoint.StandardMenu"
2: Sequence="1001" Title="Open Google">
3: <UrlAction Url="javascript:google_OpenModalDialog();" />
4: </CustomAction>
Thanks to Jan and Chankaradeep for their part in my research.