首页 > 解决方案 > 在 Laravel 中获取新的动态附加行 JQuery Ajax 的值

问题描述

我已经从数据库中获取数据并将其显示在 Laravel 项目的视图中:

// get price
$('select[name="state"]').on('change', function() {
    var stateID = $(this).val();

    if (stateID) {
        $.ajax({
            url: 'invoice/getPurchaseItems/' + stateID,
            type: "GET",
            dataType: "json",
            async: true,
            cache: false,
            success: function(data) {
                console.log(data);
                $.each(data, function(key, value) {
                    $("#brand").append(`<td>${value}</td>`);
                });
            }
        });
    }
});

这是html:

<table class="table table-striped table-bordered">
    <thead>
        <tr>
            <th scope="col">No</th>
            <th scope="col">Inventory </th>
            <th scope="col">Product </th>
            <th scope="col"> Qty in Inventory </th>
            <th scope="col">Unit</th>
            <th scope="col">Unit Price </th>
            <th scope="col">Quantity</th>
            <th scope="col">Total Price </th>
        </tr>
    </thead>
    <tbody id="brand">
    </tbody>
</table>

如何获取新动态附加行的值以便计算并将其存储在数据库中。

标签: jqueryajax

解决方案


您需要将其包装起来<td><tr>然后将其附加到<tbody>

// get price
$('select[name="state"]').on('change', function() {
    var stateID = $(this).val();

    if (stateID) {
        $.ajax({
            url: 'invoice/getPurchaseItems/' + stateID,
            type: "GET",
            dataType: "json",
            async: true,
            cache: false,
            success: function(data) {
                let newData = '<tr>';
                $.each(data, function(key, value) {
                    newData += `<td>${value}</td>`;
                });
                newData += '</tr>';
                $("#brand").append(newData);
            }
        });
    }
});

推荐阅读