title: Create a conditional HTML container in JSP tag
body: <p>I'm creating a JSP tag file for responsive images and need to conditionally wrap the element in a parent container if the attribute is specified as true.</p>
  
  <p>To do so I've just written a <code>c:choose &gt; c:when</code> statement above and below the image block but am wondering, is there a better way of doing this?</p>
  
  <pre><code>&lt;c:choose&gt;
      &lt;c:when test="${not empty wrapper}"&gt;
          &lt;div class="image-wrapper"&gt;
      &lt;/c:when&gt;
  &lt;/c:choose&gt;
  
  &lt;img class="responsive-image ${lazyload == 'true' ? 'lazy-load' : ''} ${not empty additionalClasses ? additionalClasses : ''}" src="${ defaultSrc }" data-large="${ largeSrc }" data-small="${not empty smallSrc ? smallSrc : largeSrc}" alt="${ altTitle }" /&gt;
  
  &lt;c:choose&gt;
      &lt;c:when test="${not empty wrapper}"&gt;
          &lt;/div&gt;&lt;%-- /wrapper --%&gt;
      &lt;/c:when&gt;
  &lt;/c:choose&gt;
  </code></pre>
  
  <hr>
  
  <p>The complete code looks like this:</p>
  
  <pre><code>&lt;%@ tag description="Universal image tag" language="java" pageEncoding="UTF-8" body-content="scriptless" trimDirectiveWhitespaces="true" %&gt;
  &lt;%-- this tag should replace image.tag and responsiveimage.tag --%&gt;
  
  &lt;%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %&gt;
  &lt;%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %&gt;
  
  &lt;%-- image object --%&gt;
  &lt;%@ attribute name="obj" required="false" %&gt;
  
  &lt;%-- to confirm and work with old tag --%&gt;
  &lt;%@ attribute name="largeSrc" required="false" %&gt;
  &lt;%@ attribute name="smallSrc" required="false" %&gt;
  &lt;%@ attribute name="additionalClasses" required="false" %&gt;
  &lt;%@ attribute name="id" required="false" %&gt;
  &lt;%@ attribute name="alt" required="false" %&gt;
  &lt;%@ attribute name="lazyload" required="false" %&gt;
  &lt;%@ attribute name="wrapper" required="false" %&gt;
  
  &lt;c:set var="defaultSrc" value="/assets/img/global/spacer.png" /&gt;
  &lt;c:set var="altTitle" value="${ not empty alt ? alt : '' }" /&gt;
  
  &lt;c:choose&gt;
      &lt;c:when test="${not empty obj}"&gt;
          &lt;c:forEach var="image" items="${obj}" varStatus="i"&gt;
              &lt;c:choose&gt;
                  &lt;c:when test="${empty obj}"&gt;
                      &lt;%-- need this to create nested choose --%&gt;
                  &lt;/c:when&gt;
                  &lt;c:otherwise&gt;
  
                      &lt;c:choose&gt;
                          &lt;c:when test="${not empty image.screen}"&gt;
                              &lt;c:choose&gt;
                                  &lt;c:when test="${fn:containsIgnoreCase(image.screen, 'desktop')}"&gt;
  
                                      &lt;c:url var="largeSrc" value="${image.src}"/&gt;
                                      &lt;c:set var="altTitle" value="${image.title}"/&gt;
                                      &lt;c:set var="alt" value="${image.alt}"/&gt;
  
                                  &lt;/c:when&gt;
                                  &lt;c:when test="${fn:containsIgnoreCase(image.screen, 'mobile')}"&gt;
  
                                      &lt;c:url var="smallSrc" value="${image.src}"/&gt;
  
                                  &lt;/c:when&gt;
                              &lt;/c:choose&gt;
                          &lt;/c:when&gt;
                          &lt;c:otherwise&gt;
                              &lt;c:choose&gt;
                                  &lt;c:when test="${i.first}"&gt;
  
                                      &lt;c:url var="largeSrc" value="${image.src}"/&gt;
                                      &lt;c:set var="altTitle" value="${image.title}"/&gt;
                                      &lt;c:set var="alt" value="${image.alt}"/&gt;
  
                                  &lt;/c:when&gt;
  
                                  &lt;c:when test="${i.index == 1}"&gt;
                                      &lt;c:url var="smallSrc" value="${image.src}"/&gt;
                                  &lt;/c:when&gt;
                              &lt;/c:choose&gt;
                          &lt;/c:otherwise&gt;
                      &lt;/c:choose&gt;
                  &lt;/c:otherwise&gt;
              &lt;/c:choose&gt;
          &lt;/c:forEach&gt;
      &lt;/c:when&gt;
      &lt;c:otherwise&gt;
          &lt;c:choose&gt;
              &lt;c:when test="${not empty largeSrc}"&gt;
  
              &lt;/c:when&gt;
              &lt;c:otherwise&gt;
                  &lt;c:if test="${ not empty defaultSrc }"&gt;
                      &lt;c:set var="largeSrc" value="${ defaultSrc }" /&gt;
                  &lt;/c:if&gt;
              &lt;/c:otherwise&gt;
          &lt;/c:choose&gt;
      &lt;/c:otherwise&gt;
  &lt;/c:choose&gt;
  &lt;c:choose&gt;
      &lt;c:when test="${not empty wrapper}"&gt;
          &lt;div class="image-wrapper"&gt;
      &lt;/c:when&gt;
  &lt;/c:choose&gt;
  
  &lt;img class="responsive-image ${lazyload == 'true' ? 'lazy-load' : ''} ${not empty additionalClasses ? additionalClasses : ''}" src="${ defaultSrc }" data-large="${ largeSrc }" data-small="${not empty smallSrc ? smallSrc : largeSrc}" title="${ altTitle }" alt="${ altTitle }" /&gt;
  &lt;noscript&gt;&lt;img src="${ largeSrc }" alt="${ altTitle }"&gt;&lt;/noscript&gt;
  
  &lt;c:choose&gt;
      &lt;c:when test="${not empty wrapper}"&gt;
          &lt;/div&gt;
      &lt;/c:when&gt;
  &lt;/c:choose&gt;
  </code></pre>