Customize Application Components at Site Level

From ADF Docs
Jump to: navigation, search


Most ADF Applications have various components that handle different behaviors for the application like storing and retrieving data and controlling actions within the application. However, ADF Applications are built to be highly extensible so that you can customize the application to meet your sites specific needs.

It is not a best practice to modify application components directly in the ADF. It is better to make a copy of that component and extend the original then make changes to that copy - leaving the original intact.

Why would you override a component from an Application

One reason why you may need to override a component is to change the output. Some components (like the "getNavHTML()" component in the OHSU Navigation application) returns a block of HTML that may need to be different for each site that uses the application.

Example of overriding a component

The below example uses the OHSU Navigation element as an example. In this application there is a component called navService.cfc (/ADF/apps/ohsu_nav/components/navService.cfc). In that component, there is a method called "getNavHTML()" which returns the <ul><li> for the navigation. You can override this method to change that content.

Steps to override

1. Create a directory named "ohsu_nav" in your sites /_cs_apps/ directory

2. Create a directory named "components" in the site level "ohsu_nav" directory

E.g. /mySite/_cs_apps/ohsu_nav/components/

3. Copy the /ADF/apps/ohsu_nav/components/navElementService.cfc into your site level /ohsu_nav/components/ directory

E.g /mySite/_cs_apps/ohsu_nav/components/navElementService.cfc

4. Change the "extends" attribute to point to the original navElementService.cfc

E.g <component extends="ADF.apps.ohsu_nav.components.navElementService">

5. Remove all of the methods in the navElementService (the one you just copied - not the original) except the getNavHTML() method.

For example:

<cfcomponent extends="ADF.apps.ohsu_nav.components.navElementService">

<cffunction name="getNavHTML" access="public" returnType="String">
{your code changes}


6. Reset the ADF

Now, your component will be loaded and when the render handler calls "application.ohsuNav.navElementService.getNavHTML()" it will use the site level component and any changes you made will be seen in that site. You can now complete the same steps for any other sites on your server.