Tips & Tricks: integration into the portals

by Giuseppe Lanzi on 01/16/2014

“How can I integrate applications made with Instant Developer into a web portal?” I get this question often during classes or technical meetings, and it’s followed like clockwork by “I’d like to do something like the Widget collection page“.

The first approach that comes to mind is piloting the application via URL. It’s a simple solution, but it doesn’t deliver an adequate result.

In fact, with the URL method, the presentation layer is relaunched with every interaction, because the browser reloads the whole page, and the initial Application launch screen appears. You need something different, and transparent for the end user. Something that behaves like the command box shown on the upper right in all the apps: just type inside it and hit Enter.

Try typing PIVOT in the NWind example and you’ll generate the command that opens the Pivot table without relaunching the framework. This occurs because the server-side OnCommand event is generated with PIVOT as a parameter. This is the behavior we’re after, and the trick is to use exactly the same method.

In the web page where you want to integrate the app you’ve made with, use this line of JavaScript, where ifr is the iframe in which the application is displayed and command is a string containing the command to be sent:

var ev = new ifr.contentWindow.IDEvent(“cmd”, “”, null, 7, command);

Once the command has been handled, you can use the ExecuteOnClient method and use the JavaScript code to send the response to the webpage.

Since I know you’re curious but also busy, I put together an example project for you.

Don’t say I never gave you anything 🙂

Leave a Comment

Previous post:

Next post: