Question

需要从每个产品都有自己的xml文件的Web服务中检索产品。所以我在网上找到了一个例子并进行了实验。到目前为止，javascript检索每个产品并将其放入表格行。下一个挑战是显示按行A按字母顺序排序的行，然后按列B排序（排序不是sortABLE）。任何人都可以建议如何做到这一点？正确的策略是先将xml放入数组吗？

编辑：只是为了澄清，我不是在寻找可点击的列标题或类似的东西。我想控制排序，这让我感到难过，因为每个项目都在自己的xml文件中。

以下是每个XML文件的结构（为了学习目的而简化）：

<?xml version="1.0" encoding="UTF-8"?>
    <product>
      <A>plucked</A>
      <B>banjo</B>
      <C>maple</C>
    </product>

这是HTML和javascript：

<html>
    <head>
        <title>Example</title>
        <script type="text/javascript" src="jquery.js"></script>
    </head>
    <body>
        <table border="1" id="here">
            <tr>
                <th>Method</th>
                <th>Instrument</th>
                <th>Material</th>
            </tr>
        </table>
    </body>
</html>

<script type="text/javascript">

    $(document).ready(function(){ 
        var file=new Array();
        file[1]="1.xml";
        file[2]="2.xml";
        file[3]="3.xml";
        file[4]="4.xml";
        file[5]="5.xml";
        var counter=0;
        $.each( file, function( ) {
            counter++;
            $.get(file[counter],{},function(xml){
                HTML = '';
                $('product',xml).each(function(i) {
                    colA = $(this).find("A").text();
                    colB = $(this).find("B").text();
                    colC = $(this).find("C").text();
                    data = BuildHTML(colA,colB,colC);
                    HTML = HTML + data;
                });
                $("#here").append(HTML);
            });
        });
    }); 

    function BuildHTML(A,B,C){
        output = '';
        output += '<tr>';
        output += '<td>'+ colA + '</td>';
        output += '<td>'+ colB + '</td>';
        output += '<td>'+ colC +' </td>';
        output += '</tr>';
        return output;
    }
</script>

到目前为止的输出：

<tr>
    <th>Method</th>
    <th>Instrument</th>
    <th>Material</th>
</tr>
<tr>
    <td>plucked</td>
    <td>banjo</td>
    <td>maple </td>
</tr>
<tr>
    <td>hammered</td>
    <td>piano</td>
    <td>walnut </td>
</tr>
<tr>
    <td>plucked</td>
    <td>harp</td>
    <td>cherry </td>
</tr>
<tr>
    <td>hammered</td>
    <td>dulcimer</td>
    <td>pearwood </td>
</tr>
<tr>
    <td>strummed</td>
    <td>guitar</td>
    <td>spruce </td>
</tr>

期望的输出：

<tr>
    <th>Method</th>
    <th>Instrument</th>
    <th>Material</th>
</tr>
<tr>
    <td>hammered</td>
    <td>dulcimer</td>
    <td>pearwood </td>
</tr>
<tr>
    <td>hammered</td>
    <td>piano</td>
    <td>walnut </td>
</tr>
<tr>
    <td>plucked</td>
    <td>banjo</td>
    <td>maple </td>
</tr>
<tr>
    <td>plucked</td>
    <td>harp</td>
    <td>cherry </td>
</tr>
<tr>
    <td>strummed</td>
    <td>guitar</td>
    <td>spruce </td>
</tr>

如何从单个文件中获取xml并使用jQuery排序到表行？

0 个答案: