Creating a component for a Web Form

• Using the IFrameComponent attribute
• Context awareness
• Changing the IFrameComponent properties in client code

This topic describes how to create components for web forms using the IFrameComponent attribute to embed web forms into the new user interface without the need to write client code.

Using the IFrameComponent attribute

To create an IFrameComponent, add the IFrameComponent attribute to the class as follows:

[IFrameComponent(Url="MyWebForm.aspx")]
public class MyWebForm : SystemPageBase
{
...
}

The IFrameComponent attribute is extendable so that you can add additional functionality if needed.

The IFrameComponent has some required and optional parameters as follows:

Context awareness

The component keeps track of context changes for times that you need to know when the user has changed the page in the page tree. The component reloads the iFrame (when ReloadOnContextChange is set to true) and sets query parameters with information about the context. The following parameters are set:

Changing the IFrameComponent properties in client code

Sometimes the requirements of a web form change after initialization (such as a reload on context changes). The following example shows how the properties of the IFrameComponent are changed from within the iFrame:

var reloadOnContextChange = function (value) {
    // Check that there is a parent available and it got dijit loaded
    if(parent && parent.dijit) {
        // Get all iFrames in the document
        var iframes = parent.document.getElementsByTagName(""IFRAME"");
        for(var i = 0; i < iframes.length; i++) {
            if(iframes[i].contentWindow === window) {
                // Get the dijit widget
                var component = window.parent.dijit.byId(iframes[i].id);
                if(component) {
                    component.reloadOnContextChange = value;
                }
            }
        }
    }
};

reloadOnContextChange(false);