How to make drop down list using XSLT?

Question

I have tried to make a drop down list for hot text interaction Quiz using XSLT, but it is generated and displayed for an each element. here, i need to display all the values into a drop down. what should i do in the XSLT?

XML:

        <hottextInteraction responseIdentifier="RESPONSE_1" maxChoices="0">
        <prompt>Hot text multi selection</prompt>
        <div>
        <p>The
        <hottext identifier="X99999-t01as02asi006asic001">apple</hottext>
        <hottext identifier="X99999-t01as02asi006asic002">pear</hottext>
        <hottext identifier="X99999-t01as02asi006asic003">carrot</hottext>
        <hottext identifier="X99999-t01as02asi006asic004">potatoe</hottext> grow on trees.</p>
        <p>The
        <hottext identifier="X99999-t01as02asi006asic005">cherry</hottext>
        <hottext identifier="X99999-t01as02asi006asic006">watermelon</hottext>
        <hottext identifier="X99999-t01as02asi006asic007">orange</hottext>
        <hottext identifier="X99999-t01as02asi006asic008">potatoe</hottext> grow in soil.</p>
        </div>
        </hottextInteraction>

XSLT:

    <xsl:template match="//hottextInteraction"><div class="quizborder"><xsl:apply-templates /></div></xsl:template>
    <xsl:template match="//hottext"><select name="hottext"><option value="hottext"><xsl:value-of select="." /></option></select></xsl:template>    

OUTPUT:

        <div>
        <div class="quizborder">
        <p>Hot text multi selection</p>
        <div>
        The
        <select name="hottext"><option value="hottext">apple</option></select>
        <select name="hottext"><option value="hottext">pear</option></select>
        <select name="hottext"><option value="hottext">carrot</option></select>
        <select name="hottext"><option value="hottext">potatoe</option></select> grow on trees.
        The
        <select name="hottext"><option value="hottext">cherry</option></select>
        <select name="hottext"><option value="hottext">watermelon</option></select>
        <select name="hottext"><option value="hottext">orange</option></select>
        <select name="hottext"><option value="hottext">potatoe</option></select> grow in&nbsp;soil.
        </div>
        </div>
        </div>

I need the result:

        <div>
        The
        <select name="hottext">
        <option value="apple">apple</option>
        <option value="pear">pear</option>
        <option value="carrot">carrot</option>
        <option value="potatoe">potatoe</option>
        </select>
        grow on trees.
        The
        <select name="hottext">
        <option value="cherry">cherry</option>
        <option value="watermelon">watermelon</option>
        <option value="orange">orange</option>
        <option value="potatoe">potatoe</option>
        </select> grow in&nbsp;soil.
        </div> 

Answer 1

If you are interested in seeing an XSLT 2.0 solution, you can use xsl:for-each-group to group adjacent hottext nodes. Try this XSLT

<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="3.0">
  <xsl:output method="html" indent="yes" html-version="5"/>

  <xsl:strip-space elements="*" />

  <xsl:template match="hottextInteraction">
    <div class="quizborder">
      <xsl:apply-templates />
    </div>
  </xsl:template>

  <xsl:template match="hottext">
    <option value="{.}">
      <xsl:value-of select="." />
    </option>
  </xsl:template>

  <xsl:template match="*[hottext]">
    <xsl:for-each-group select="node()" group-adjacent="boolean(self::hottext)">
      <xsl:choose>
        <xsl:when test="current-grouping-key()">
          <select>
            <xsl:apply-templates select="current-group()" />
          </select>
        </xsl:when>
        <xsl:otherwise>
          <xsl:apply-templates select="current-group()" />
        </xsl:otherwise>
      </xsl:choose>
    </xsl:for-each-group>
  </xsl:template>
</xsl:stylesheet>

Note the use of <xsl:strip-space elements="*" /> which is necessary to ignore the whitespace nodes between hottext nodes.

Answer 2

One approach is using a mode attribute on the following-siblings axis to create the option elements:

<xsl:template match="hottext[position() = 1]"> <!-- wrap following-siblings in 'select' element --> 
    <select name="hottext">
        <xsl:apply-templates select=". | following-sibling::hottext" mode="next"/>
    </select>
</xsl:template>

<xsl:template match="hottext" mode="next">     <!-- create option elements -->
    <option value="hottext">
        <xsl:value-of select="." />
    </option>
</xsl:template>

<xsl:template match="hottext" />               <!-- skips hottext elements without 'mode' -->

To get rid of superfluous white-space you can use

<xsl:strip-space elements="hottext" />

at the beginning of the stylesheet.