Software Development, Web Design, Training


Mura CMS: Display Objects Inside Display Objects

Among other changes, Mura 7 includes several new updates to Display Objects. One of the new features we learned about (and helped QA with Blue River while working on a project with them) was the ability to add Display Objects inside other Display Objects. It's actually quite simple, and gives you a lot of flexibility for more advanced UI options.

For example, let's say I have a Display Object called “Musician List Widget” that lists out all the musicians in a database table (or content feed, or whatever). As part of that UI, I want to have a “detail” Display Object that can be rendered from within Musician List Widget. I'd set up the directory structure like so:

Mura CMS Display Object folder structure

So my MusicianListWidget object is basically a standard Display Object: it's got a config.xml.cfm file, a configurator.cfm and an index.cfm as we'd expect. The new piece is that /display_objects folder that also lives inside MusicianListWidget. Notice that inside there I have “MusicianDetailItem”, which is its own Display Object: complete with its own config.xml.cfm, index.cfm (and in this case a contentRenderer.cfc, which is just depends on what you want your Display Object to do).

So how do you get the MusicianListWidget to render the MusicianDetailItem? It's literally one line of code!

#$.dspObject( object='MusicianDetailItem', objectParams=objectParams )#

So let's say your MusicanListWidget grabs entries out of a content feed or a database query or some such thing, and you need to loop over them, rendering new MusicianDetailItems for each entry:

<cfloop query='qryMyContentFeed'>
#$.dspObject( object='MusicianDetailItem', objectParams=objectParams )#

Boom, done. And because it's all contained inside the same directory structure, it's all very portable too. To get both the MusicanListWidget and the MusicianDetailItems to work on a site, all you have to do is drag the MusicianListWidget onto your page, and all the Detail functionality comes along with it automatically.

Note: if you're not on the latest version(s) of Mura 7 this may not work correctly; make sure you do a site and core update to get some of the more recent changes and bug fixes.