Comment puis-je cacher correctement une liste d'éléments XML traités par XSL en utilisant javascript

Question

Bonjour. J'ai un fichier XML qui contient des listes d'avertissement et d'erreurs provenant d'une sortie de construction. J'ai réussi à écrire XSL pour itérer sur les listes séparées d'avertissements et d'erreurs pour les afficher dans mon navigateur. Ce que je voudrais faire maintenant serait d'ajouter un peu de javascript afin d'ajouter un lien/bouton pour être en mesure de basculer l'affichage des avertissements. Je ne peux pas le faire fonctionner correctement.

est ici le code relvant (coupé à ce que je l'espère sont les éléments essentiels)

<xsl:template match="/"> 
    <xsl:variable name="messages" select="/cruisecontrol//buildresults//message" /> 
    <xsl:variable name="warning.messages" select="$messages[(contains(text), 'warning ')) or @level='Warning']" /> 
    <xsl:variable name="warning.messages.count" select="count($warning.messages)" /> 
    <xsl:if test="$warning.messages.count > 0"> 
     <script type="text/javascript"> 
      function toggleWarnings() { 
       eDiv = document.getElementById("warnings"); 
       tDiv = document.getElementById("warningsTitle"); 
       if (eDiv.style.display == "none") { 
        eDiv.style.display = "inline"; 
        tDiv.innerText = "Hide Warnings"; 
       } else { 
        tDiv.innerText = "View Warnings"; 
        eDiv.style.display = "none"; 
       } 
      } 
     </script> 
     <table> 
      <tr> <td> 
       <a href="javascript:void()" onclick="javascript:toggleWarnings(); return false;"> 
        <span id="warningsTitle">View Warnings</span> 
       </a> 
      </td> </tr> 
      <xsl:for-each select="$warning.messages"> 
       <tr> <td class="warning" id="warnings" style="display: none;"> 
        <xsl:value-of select="."/> 
       </td> </tr> 
      </xsl:for-each> 
     </table> 

Le problemt que j'ai est que seul un avertissement est affiché jamais après avoir frappé le lien « Afficher les mises en garde ». Mon problème est que je connais assez de HTML, XSL, et javascript pour être légèrement dangereux et la combinaison prouve que je ne sais pas assez :-)

Y at-il un moyen facile pour moi de parcourir les éléments XSL, afficher puis dans une table et aussi être en mesure de cacher tous ces éléments sous un lien bascule?

Merci.

Answer 1

Essayez-le - les commentaires sont dans le code.

<xsl:template match="/"> 
<xsl:variable name="messages" select="/cruisecontrol//buildresults//message" /> 
<xsl:variable name="warning.messages" select="$messages[(contains(text), 'warning ')) or @level='Warning']" /> 
<xsl:variable name="warning.messages.count" select="count($warning.messages)" /> 
<xsl:if test="$warning.messages.count > 0"> 
    <script type="text/javascript"> 
     function toggleWarnings() 
     { 
      // Get the table 
      var table = document.getElementById("warnings"); 

      // Get all the rows in the table 
      var rows = table.getElementsByTagName('tr'); 

      tDiv = document.getElementById("warningsTitle"); 

      if (tDiv.innerHTML == 'View Warnings') 
      { 
       for (var i = rows.length - 1; i >= 0; i--) 
       { 
        // Skip any rows that aren't warnings 
        if (rows[i].className != 'warning') 
         continue; 

        try 
        { 
         // Try it the right way 
         rows[i].style.display = 'table-row'; 
        } 
        catch (e) 
        { 
         // Try it the IE way 
         rows[i].style.display = 'block'; 
        } 

       tDiv.innerHTML = "Hide Warnings"; 
      } 
      else 
      { 
       for (var i = rows.length - 1; i >= 0; i--) 
       { 
        // Skip any rows that aren't warnings 
        if (rows[i].className != 'warning') 
         continue; 

        rows[i].style.display = 'none'; 
       } 

       tDiv.innerHTML = "View Warnings"; 
      } 

      return false; 
     } 
    </script> 
    <!-- Moved the ID to the table - IDs must be unique! --> 
    <table id="warnings"> 
     <tr> 
      <td> 
       <!-- This is must shorter, and "javascript:" inside onclick is plain wrong --> 
       <a href="#" onclick="return toggleWarnings();"> 
        <span id="warningsTitle">View Warnings</span> 
       </a> 
      </td> 
     </tr> 
     <xsl:for-each select="$warning.messages"> 
      <!-- Moved the class to the tr --> 
      <tr class="warning" style="display: none;"> 
       <td> 
        <xsl:value-of select="."/> 
       </td> 
      </tr> 
     </xsl:for-each> 
    </table>