CODEWITHSUNDEEP
templatesjsf-2facelets
Mat Haas
Mat Haas

Reputation: 41

How can I wrap optional facelet template content in a div tag?

I'm a long time JSP user but facelets newbie and am stuck on what I thought would be a really simple task.

How can I wrap optional template content in a div tag?

For example given the following simplified template:

<?xml version='1.0' encoding='UTF-8' ?>
<html xml:lang="en" lang="en"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html">

    <h:head>
        <!-- head stuff here -->
    </h:head>

    <h:body>
        <!-- main body stuff here -->
        <div class="border-box">
            <ui:insert name="optional" />
        </div>
    </h:body>

</html>

If I use this template without defining the optional content I'll get an unwanted empty box.

I've searched for a solution and found the same question posed a few times but no real answer.

Can anyone help me out? This seems to me to be quite a reasonable thing to want to do with a templating system but it's got me stumped.

Upvotes: 2

Views: 865

Answers (2)

Mat Haas
Mat Haas

Reputation: 41

Thanks mael, ui:fragment seems to be the way to go when the content will fit in a ui:param value attribute but I'm going with your first suggestion. I will template-ize the wrapper though with a ui:decorate.

Page template:

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="en" lang="en"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html">

    <h:head>
        <!-- head stuff here -->
    </h:head>

    <h:body>
        <!-- main body stuff here -->
        <ui:insert name="optional" />
    </h:body>

</html>

Wrapper template:

<?xml version='1.0' encoding='UTF-8' ?>
<ui:composition
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets">

    <div class="border-box">
        <ui:insert />
    </div>

</ui:composition>

Invocation:

<?xml version='1.0' encoding='UTF-8' ?>
<ui:composition
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    template="page.xhtml">

    <!-- other ui:defines -->

    <ui:define name="optional">
        <ui:decorate template="wrapper.xhtml">
            <!-- optional content -->
        </ui:decorate>
    </ui:define>

</ui:composition>

Upvotes: 2

ElderMael
ElderMael

Reputation: 7111

Just delete the div and make something like this in the page that uses your template:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head />
<body>
<ui:composition template="template.xhtml">
  <ui:define name="optional">
    <div class="border-box">
        <!-- Content here -->
    </div>
</ui:define>
</ui:composition>
</body>
</html>

Upvotes: 0

Related Questions