I recently had a need to conditionally include a new client-side javascript library on an XPage after another library was loaded. The other library was loaded within the body of the page and not within the header, so, in this case, it did not work to include the new library as a page resource.
However, when I put an <xp:script> tag within the body of the page, I received this error:
The complex type tag (xp:script) must be within a property tag, like <this.something>
Normally, those tags appear within <this.resources>.
So, I needed a way to conditionally include a passthru <script> tag to load the library.
My solution was to wrap it within an <xp:span> tag. Since it’s an xp tag, I can use a server-side rendered formula. If it returns true, then the passthru script tag will be added to the page. Admittedly, it feels like a bit of a hack, but it does the job:
<xp:span rendered="#{javascript:context.getUserAgent().isIE()}" >
<script src="MyLibrary.js" />
</xp:span>
For the record…
I’m not advocating this as ideal design. But if there is some case where you need to conditionally include a script tag within the bod of an XPage, this will do the trick. In my case, I was updating an application and needed to keep the changes to a minimum.
Library Relative Reference
There’s a secondary tip in here, which Marky Roden pointed out. With a passthru <script> tag, do not start the src url with a backslash (/), even though that’s what the <xp:script> tags do. On a passthru <script> tag, that will be relative to the server root.
Image may be NSFW.
Clik here to view.
Image may be NSFW.Clik here to view.
