Как правильно скрыть список XML-элементов, обработанных XSL, используя JavaScript - PullRequest
2 голосов
/ 07 ноября 2008

Доброе утро. У меня есть файл XML, который содержит списки предупреждений и ошибок из вывода сборки. Я успешно смог написать XSL для перебора отдельных списков предупреждений и ошибок, чтобы они отображались в моем браузере. Далее я хотел бы добавить немного JavaScript, чтобы добавить ссылку / кнопку, чтобы можно было переключать отображение предупреждений. Я не могу заставить его работать должным образом.

вот соответствующий код (урезанный до того, что, я надеюсь, является основным)

<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>

Проблема, с которой я столкнулся, заключается в том, что после нажатия на ссылку «просмотреть предупреждения» отображается только одно предупреждение. Моя проблема в том, что я знаю достаточно HTML, XSL и javascript, чтобы быть немного опасным, а комбинация доказывает, что я недостаточно знаю: -)

Есть ли для меня простой способ перебирать элементы XSL, отображать их в виде таблицы, а также иметь возможность скрывать все эти элементы при переключении ссылок?

Спасибо.

1 Ответ

3 голосов
/ 07 ноября 2008

Попробуйте - комментарии в коде.

<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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...