使用 Jquery 从 Web 服务获取多个数据答案

【问题标题】：Get multiple Data from web service using Jquery使用 Jquery 从 Web 服务获取多个数据
【发布时间】：2018-05-11 14:13:58
【问题描述】：

我有一个返回 dataTable 的 web 服务函数...我想从这个 table1 标签中添加数据...

  <Table1 diffgr:id="Table11" msdata:rowOrder="0">
    <ProductID>1</ProductID><ProductName>A</ProductName><AvailableProduct>8</AvailableProduct>
    </Table1>
<Table1 diffgr:id="Table12" msdata:rowOrder="1">
    <ProductID>2</ProductID><ProductName>B</ProductName><AvailableProduct>3</AvailableProduct>
    </Table1>
<Table1 diffgr:id="Table13" msdata:rowOrder="2">
    <ProductID>3</ProductID><ProductName>C</ProductName><AvailableProduct>7</AvailableProduct>
    </Table1>
<Table1 diffgr:id="Table14" msdata:rowOrder="3">
    <ProductID>4</ProductID><ProductName>D</ProductName><AvailableProduct>0</AvailableProduct>
    </Table1>
<Table1 diffgr:id="Table15" msdata:rowOrder="4">
    <ProductID>5</ProductID><ProductName>E</ProductName><AvailableProduct>3</AvailableProduct>
    </Table1>
<Table1 diffgr:id="Table16" msdata:rowOrder="5">
    <ProductID>6</ProductID><ProductName>F</ProductName><AvailableProduct>1</AvailableProduct>
    </Table1>

这是我的 Jquery 代码...这不会在表中附加任何内容我该如何解决这个问题

  $(document).ready(function () {
        $("#Btn").click(function () {
            alert();

            $.ajax({
                type: 'POST',
                url: 'WebserviceDS.asmx/GetTable',
                dataType: 'xml',
                data:"{}",
                Success: function (xml) {
                    $(xml).find('Table1').each(function () {
                        $("<tr><td>" + $(xml).find('ProductID').text() + "</td>").appendTo("table");
                        alert($(xml).find('ProductID').text());
                        $("<td>" + $(xml).find('ProductName').text() + "</td>").appendTo("table");
                        $("<td>" + $(xml).find('AvailableProduct').text() + "</td></tr>").appendTo("table");
                    })
                },
                error: function (err) {
                    alert(err);
                }

            });
            return false;
        })
    })

在这些警报中，它不会显示任何内容..这是我的 HTML 代码

<body>

    <form id="form1" runat="server">
        <div>
            <button id="Btn">Click Me</button>
            <table>
                <tr>
                    <th>ProductID</th>
                    <th>ProductName</th>
                    <th>AvailableProduct</th>
                </tr>

            </table>
        </div>
    </form>
</body>

【问题讨论】：

但是警报会被执行吗？
你能在success回调方法中分享xml的确切输出吗？也不应该是success 注意Success（假设）在发布问题时输入错误
@Satpal 抱歉，现在我执行了我在警报 0_o 中有“123456”的最后一个代码
@Satpal 然后我在结果 ProductID ProductName AvailableProduct 123456 123456 123456 123456 123456 123456 ABCDEF 837031 ABCDEF 837031 ABCDEF 837031 ABCDEF 837031 ABCDEF 837031 ABCDEF

标签： jquery html xml web-services asp.net-ajax

【解决方案1】：

在each() 中使用回调value 访问索引处的对象。
创建完整的<TR>，然后附加必要的<TD> 子元素，最后将<TR> 附加到表中。

例子

$(xml)
    .find('Table1')
    .each(function (index, value) {
        var tr = $('<tr>');
        tr.append($('<td>').text($(value).find('ProductID').text()));
        tr.append($('<td>').text($(value).find('ProductName').text()));
        tr.append($('<td>').text($(value).find('AvailableProduct').text()));
        tr.appendTo("table");
    });

【讨论】：

@Setpal 非常感谢