java - 使用 Ajax 将数据添加到表行

Question

我需要从 java 脚本将数据添加到表中。Tha 表在同一个 .jsp 文件中，但不在脚本中。

AJAX 调用

<script type="text/javascript">
        function searchDetails() {

            $.ajax({
                type : "post",
                data : {
                    'accountNo' : $(accNumber).val()
                },
                url : "/banking-internet/account-history/add",
                cache : false,
                success : function(data) {
                    var transactionList = data;
                },
                error : function(e) {
                    alert('Error: ' + e);
                }
            });

        }
    </script>

桌子

             <tr>
                <th>Transaction Type</th>
                <th>Amount</th>
                <th class="hide-on-mobile">Description</th>
            </tr>
            <c:forEach var="transaction" items="${transactionList}">
                <tr>
                    <td>${transaction.transactionDate}</td>
                    <td>${transaction.transactionType}</td>                     
                    <td>${transaction.accountNarration}</td>
                </tr>
            </c:forEach>

正确传递给数据的值。但我似乎无法从脚本中获取价值并使用它。

success : function(data) {
                        var transactionList = data;
                    },

这部分正确地从控制器获取值。

请帮忙

Answer 1

为您的表添加一个 ID，例如：

    <table id="test_table">

然后调用这个：

    success : function(data) {
                    var transactionList = data;
                    addRow ("test_table", transactionList);
    },

最后替换 cellX.innerHtml = data.whatever_member_object;

    <script language="javascript">
    function addRow(tableID, data) {

        var table = document.getElementById(tableID);

        var rowCount = table.rows.length;
        var row = table.insertRow(rowCount);

        var cell1 = row.insertCell(0);
        cell1.innerHtml = data;

        var cell2 = row.insertCell(1);
        cell2.innerHTML = data;

        var cell3 = row.insertCell(2);
        cell3.innerHTML = data;             
    }
    </script>

希望它有效。