FIM 2010 Portal: Introduction to Dynamic RCDC with Jquery

I did a video presentation on this topic for the Unify FIM User Group.

One of not so exciting things about the FIM Portal RCDC forms is that they are basically flat in nature, it is limited in the types of controls you can put and you can’t change fields based on the choices made in other fields. We want the form to be “alive” and event driven. What people have done is to

1- Use the rights level option or use the checkbox option like what we have in the Edit Security group (when you select email enabled the email field shows.

2- Write your own aspx page and replace the OOB aspx page.

3-Use the postback option to refresh the form data.

Option one is hardly dynamic, adds just a tad of life in my view, there are many things that one can’t do. Option two is great except you virtually have to rebuild the the whole FIM Portal form your self. So you have to define a style sheet for your form, then you have to define the objects (Person, group), you can find some good starter information on some blogs. You got to have some love for web development to do that option. There are some minuses I don’t like about this option namely that it is  complicated to support. Option three is very good and actually can be used in combo with javascript.

The history of Jquery you can find in many places on the web but it reminds me of what we were faced with in the early days of the internet. The HTML page, was like RCDC basically a flat page, it wasn’t a big deal in the early internet days but today with the internet alive and connected, you need web pages that can be connected to various sources and can change based on events in the form of even around the world. The Document Object Model (DOM) is a web api interface that allows a developer (via a program like Jquery, Javascript) to interact with objects in HTML, XML (Oh..like RCDC) documents.

Lets dive into it. How do I connect Jquery to RCDC. Couple of foundational items.

1- Download the Jquery library from here. I have stayed with 1.7.2 but you can get either version 1 (compatible with older IE versions) or version 2. I haven’t yet encountered a case where a feature i wanted required me to use a higher version than 1.7.2, my preference. Copy it to C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\12\TEMPLATE\IMAGES\MSILM2\Scripts

2- Say you want to bring alive the create new person form go to the location of the aspx pages C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\12\TEMPLATE\FEATURES\MSILM2SitePages\SitePages\aspx\users open the createperson.aspx page, you can use notepad or Visual Studio. I user VS 2010, you need SP1 which adds the JScript Intellisense  to your VS. Add this to the top of the page

<asp:Content id=”content1″ ContentPlaceHolderID=”PlaceHolderMain” runat=”server”>
/_layouts/images/MSILM2/Scripts/jquery-1.7.2.min.js

At the bottom add this

<IdentityManagement:CreatePerson runat=”server” id=”CreatePerson”/>
</asp:Content>

3- Identify an RCDC object in the DOM. I have talked about the DOM as an interface to RCDC objects, those objects have a control id in the DOM. Here is the format for the RCDC control id in the DOM

#ctl00_PlaceHolderMain_CreatePerson_uoc_BasicInfo_grouping_DisplayName_control_internalTextBox

#ctl00 – should always start with this, its “CTL” not “CT1”, I spent a whole day trying to debug my program until I discovered this simple error.

PlaceHolderMain – that is the content id at the top of the form

CreatePerson – that is the id of the form

BasicInfo is the name of the grouping in the RCDC

Displayname is the name of the control in the RCDC

Jquery is an event driven program. It helps you define what would happen when there is an event like a field changes value. So it is not a program that runs with your form, it loads when your form is opened and sits and waits for the event defined to happen.