dominoGuru.com

Your Development & Design Resource

HTML TagNames for IBM XPages xp:text Controls

05/07/2012 02:27 PM by Chris Toohey

IBM XPages xp:text Controls allow you to use the tagName property to change the default rendered HTML Element container from a SPAN to... well, pretty much whatever you want.

Here's a few examples to explain...

Example:


<xp:text value="foo" tagName="h1" />

-- will produce the following HTML markup:


<h1 class="xspTextComputedField">foo</h1>

Using the escape Property of the xp:text Control, you can load HTML markup (vs. the default Text), and get something like an HTML Unordered List:


<xp:text

    tagName="ul"

    escape="false">

    <xp:this.value>

        <![CDATA[<li>Hello</li>

            
<li>World</li>

        ]]>

    </xp:this.value>

</xp:text>

-- which generates the following HTML markup:


<ul class="xspTextComputedField">

    <li>Hello</li>

    <li>World</li>

</ul>

Of course, you'll most likely want to set the styleClass Property of the xp:text Control to something other than xspTextComputedField, as the xsp.css (and other XPages-specific stylesheets) use non-Element specific className assignments in their CSS.

For example, from the xsp.css Stylesheet:


.xspTextComputedField {

    font-weight: 
normal;

}

... which I personally can't stand, and I think makes things ultimately more difficult, but that's a tangent/rant for another post.

The point is, with the tagName Property, you can do some pretty slick stuff. And with Domino 8.5.3, you can set pretty much any HTML Element you like, and easily compute the value.

Online Demo

Here's a simple demo that you can play with. It uses sessionScope variables to control the value, tagName, styleClass, and even the escape Properties of the example xp:text Control. This gives you a pretty decent sandbox that you can use to test things out and see just how far you can take a simple xp:text Control.

HTML TagNames for IBM XPages xp:text Controls - Online Demo

In a future post (perhaps tomorrow, but let's be honest - I make no promises), I'll discuss another method you can employ to get pretty much any pass thru markup to co-exist with core XPages Controls, which should in turn address any HTML markup delivery need you can imagine.

About the author: Chris Toohey

Thought Leadership, Web & Mobile Application Development, Solutions Integration, Technical Writing & Mentoring

A published developer and webmaster of dominoGuru.com, Chris Toohey specializes in platform application development, solutions integration, and evangelism of platform capabilities and best practices.