0

I'm creating something like a dictionary online where users can add their words using a simple form and then they can see all the words in a page, in alphabetical order of the words, the problem is that it doesn't show it alphabetically but in the order of insertion.

I got 3 files, res.xml, which is the file with the data, tt.xsl which is supposed to sort res.xml in alphabetical order, and index.html which shows the data to the user, i would like to sort the data contained in the xml file alphabetically using the attribute 'WORD', but when i run index.html it doesn't sort it , it just shows it in the order of reading data, what's the easiest way to make it work?

Here are the 3 files

THIS IS THE HTML FILE WITH A SCRIPT I'M USING TO VISUALIZE IT

<html>
<body>

<script>
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
 xmlhttp=new XMLHttpRequest();
 }
else
 {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.open("GET","res.xml",false);

xmlhttp.send();
xmlDoc=xmlhttp.responseXML; 

document.write("<table border='1'>");
var x=xmlDoc.getElementsByTagName("TERM");for (i=0;i<x.length;i++)
{ 
document.write("<tr><td>");
document.write(x[i].getElementsByTagName("WORD")[0].childNodes[0].nodeValue);
document.write("</td><td>");

document.write("</td><td>");
document.write(x[i].getElementsByTagName("LANGUAGE")[0].childNodes[0].nodeValue);
document.write("</td><td>");

document.write(x[i].getElementsByTagName("DESCRIPTION")[0].childNodes[0].nodeValue);
document.write("</td></td>");

document.write("</td><td>");
document.write(x[i].getElementsByTagName("EDITBY")[0].childNodes[0].nodeValue);
document.write("</td></tr>");
}
document.write("</table>");
</script>

</body>
</html>

//------------------------------ THIS IS THE XML FILE res.xml

<?xml version="1.0" encoding="ISO-8859-1"?>
<!-- Edited by XMLSpy® -->


<?xml-stylesheet type="text/xsl" href="tt.xsl"?>

<LIBRARY>
<TERM>
<EDITBY>giovanni</EDITBY>
<WORD>ciao</WORD>
<LANGUAGE>Italian</LANGUAGE>
<DESCRIPTION>
it means hi
</DESCRIPTION>  
</TERM>


<TERM>
<EDITBY>giacomo</EDITBY>
<WORD>all</WORD>
<LANGUAGE>italian</LANGUAGE>
<DESCRIPTION>
significa tutto
</DESCRIPTION>  
</TERM>

</LIBRARY>

//----------------------------------

THIS IS THE XSL tt.xsl

<?xml version="1.0" ?> 
<xsl:stylesheet version="1.0" 
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:template match="/">



<xsl:for-each select="LIBRARY/TERM">
  <xsl:sort select="WORD"/>
  <tr>
    <td><xsl:value-of select="LANGUAGE"/></td>
    <td><xsl:value-of select="WORD"/></td>
  </tr>
</xsl:for-each>


</xsl:template>
</xsl:stylesheet>

RESULT, IT SHOWS THE DATA BUT NOT IN ALPHABETICAL ORDER

ANY HELP WOULD BE GREATLY APPRECIATED

4

2 回答 2

0

查看 javascript,在获取 XML 后,您正在执行诸如getElementsByTagName("WORD"). WORD是您的输入 XML 中的一个元素,但您的 XSLT 会转换您的 XML 输入trtd。这应该给您一个线索,即您的 XSLT 正在实际被调用,并且您的 XML 没有被转换。您的 javascript 所做的就是按照它们出现的顺序从 XML 中读取元素。

现在,在您的 XML 中,您确实有以下处理指令:

<?xml-stylesheet type="text/xsl" href="tt.xsl"?>

但是,只有在浏览器中直接访问 XML(即,您在 URL 中键入“res.xml”以显示 XML)时,才会“处理”此“指令”。用 javascript 读取 XML 文件实际上不会关注这个处理指令。此时您只是在读取文件的内容,由您自己编写代码来处理它。

编写 javascript 来执行 XSLT 转换并不难。主要的复杂性来自 IE 与 Firefox 和 Chrome 的不同之处。我在 Stack Overflow 上进行了快速搜索,发现了这个问题,它解释了如何做到这一点

http://stackoverflow.com/questions/5722410/how-can-i-use-javascript-to-transform-xml-xslt

这是提供的 javascript 的改编,在这种情况下应该可以工作

<html>
<body>

<script>
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
 xmlhttp=new XMLHttpRequest();
 }
else
 {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.open("GET","test.xml",false);

xmlhttp.send();
xmlDoc=xmlhttp.responseXML; 

xmlhttp.open("GET","test.xslt",false);

xmlhttp.send();
xsl=xmlhttp.responseXML; 

var result;

// IE method
if (window.ActiveXObject) {
    result = new ActiveXObject("MSXML2.DOMDocument");
    xmlDoc.transformNodeToObject(xsl, result);

// Other browsers
} else {
    result = new XSLTProcessor();
    result.importStylesheet(xsl);
    result = result.transformToDocument(xmlDoc);
}

var x, ser, s = '';

// IE method.
if (result.childNodes[0] && result.childNodes[0].xml) {
    for (x = 0; x < result.childNodes.length; x += 1) {
        s += result.childNodes[x].xml;
    }
// Other browsers
} else {
    ser = new XMLSerializer();
    for (x = 0; x < result.childNodes.length; x += 1) {
        s += ser.serializeToString(result.childNodes[x]);
    }
}

document.write(s);

</script>
</body>
</html>

这里唯一需要注意的是,最好在 XSLT 中输出“table”元素。所以,你的 XSLT 看起来像这样

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml">

<xsl:output method="html" />

<xsl:template match="/">
<table border="1">
<xsl:for-each select="LIBRARY/TERM">
  <xsl:sort select="WORD"/>
  <tr>
    <td><xsl:value-of select="LANGUAGE"/></td>
    <td><xsl:value-of select="WORD"/></td>
  </tr>
</xsl:for-each>
</table>
</xsl:template>
</xsl:stylesheet>
于 2013-10-11T15:14:37.023 回答
0

您需要向 XSL 添加一个输出元素,如下所示:

<xsl:output method="html"/>

这将在您的样式表标签下方。

这是您可以添加到输出标签的最少信息。没有它,一些(全部?)处理器根本无法处理 XSL。

作为旁注,我不完全确定您在使用 javascript 做什么,但您应该能够在 XSL 中创建整个表结构,而无需所有额外的脚本。但这将是第二个问题的主题。

所以当你运行这个 XML

<LIBRARY>
  <TERM>
    <EDITBY>giovanni</EDITBY>
    <WORD>ciao</WORD>
    <LANGUAGE>Italian</LANGUAGE>
    <DESCRIPTION>
      it means hi
    </DESCRIPTION>  
  </TERM>
  <TERM>
    <EDITBY>giacomo</EDITBY>
    <WORD>all</WORD>
    <LANGUAGE>italian</LANGUAGE>
    <DESCRIPTION>
      significa tutto
    </DESCRIPTION>  
  </TERM>
</LIBRARY>

有了这个 XSL

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:output method="html"/>
  <xsl:template match="/">
    <xsl:for-each select="LIBRARY/TERM">
      <xsl:sort select="WORD"/>
      <tr>
        <td><xsl:value-of select="LANGUAGE"/></td>
        <td><xsl:value-of select="WORD"/></td>
      </tr>
    </xsl:for-each>
  </xsl:template>
</xsl:stylesheet>

您将获得此 HTML,其信息按 WORD 元素排序。

<tr>
<td>italian</td><td>all</td>
</tr><tr>
<td>Italian</td><td>ciao</td>
</tr>
于 2013-10-10T18:20:41.627 回答