In an application that I am building at the moment, I had need to “mash-up” content from different sources into a SharePoint site. This SharePoint site would;
- Use an iframe to pull in a list of content from another server
- Launch a modal dialog (AJAX style) overlaid on top of the SharePoint portal with an iframed form to action against the data
- Display validation errors from that form as another modal dialog (owned by the parent SharePoint page so as not to be size limited to the owning dialog).
A picture says a thousand words;
In this case, we’d want the SharePoint host page to offer two methods
- launchTool(url) – which will launch the given URL in an iframe within a modal jquery overlay (using boxy in my instance).
- displayValidation(message) – which will be called by the form iframe to display the validation messages if the form can’t be submitted
So, what can we do?
It’s important to note the # part of the URL – by doing this, the cross domain receiver page can be fully cached in the browser, meaning there should be no lag between making the request down the stack to the parent actually processing that request.
I’ve wrapped the above into an API and built a sample that does the above, but also supports bi-directional message passing – so our host page has a list from another domain, it asks the host to display a form from yet another domain and this form requires confirmation, so it asks the host to display a message with options – the result of this message is then passed back down to the form.
Get the source code here: http://xdsframes.codeplex.com
(This isn’t a finished API in any way, just a starting off point for solving your own cross domain issues.)