Question

对于通过ajax调用从数据库中提取的产品，我有一个动态部分。一些结果是单行，其他结果是多行。我在主页上有一个占位符HTML行。它用于初始数据输入，可以用java删除或添加其他行。我想要的操作是通过Ajax调用从数据库中提取返回的行并添加/填充结果。我确定我需要先删除占位符，然后用返回的每一行重新创建HTML。同样不确定如何用每个元素在name处的现有item_desc[]字段填充JQuery元素。我知道id是唯一的，并且类可以是多个，所以我唯一的选择是name元素。

HTML：

<tr class="item-row">
          <td class="item-name"><div class="delete-wpr"><textarea form ="testinsert" name="item_name[]">Hourly Rate</textarea>
          <a class="delete" href="javascript:;" title="Remove row">X</a>
          <a class="add-product" href="javascript:;" title="Add Product">A</a>
          </div></td>
          <td class="description"><textarea form ="testinsert" name="item_desc[]">Residential Rate: Consulting/Labor/Installs</textarea></td>
          <td><textarea class="cost" form ="testinsert" name="item_cost[]">$95.00</textarea></td>
          <td><textarea class="qty" form ="testinsert" name="item_qty[]">0</textarea></td>
          <td><span class="price" form ="testinsert" name="item_price[]">$95.00</span></td>
</tr>

jQuery：

function populateTableRow(data, selectedProductAutonum) {
                var invoices;
                $.each(data, function() {
                    if (this.autonum == selectedProductAutonum) {
                        invoices = this;
                        return false;
                    }
                });

                $('[name="item_desc[0]"]').val(invoices.description);
                $('[name="item_cost[0]"]').val(invoices.cost);
                $('[name="item_qty[0]"]').val(invoices.quantity);
                $('[name="item_price[0]"]').val(invoices.price);

            }

Answer 1

您需要遍历从ajax获得的数据，并在元素已经存在的情况下附加元素（我假设它们也必须具有唯一的名称），否则我无法在< / p>

<div class="flightDetails" id="flightDetails"></div>

之后，您可以使用它查看元素的名称或ID

for (i = 0; matches[0].detail.length; i++) {
    var div = document.createElement('div');

    div.className = 'flightDetailBox';
    div.innerHTML = '<p id="flightCost">' + 'Rs' + matches[0].detail[i].price + '</p>'
    '<p id="flightID">' + matches[0].detail[i].FlightNum + '</p>'
    '<p id="fromTo">' + matches[0].from > +matches[0].to + '</p>'
    '<p id="departTime">' + matches[0].detail[i].departTime + '</p>'
    '<p id="ariveTime">' + matches[0].detail[i].arriveTime + '</p>' +
    '<button type="submit" id="bookTicketButton" onclick="bookTicket()">BOOK TICKET</button>';

    document.getElementById('flightDetails').appendChild(div);
}

如果您没有创建元素，则可以使用HandleBar.JS

轻松创建

如果您需要进一步的帮助，请告诉我。

或者如果您在表中没有唯一的ID或元素的唯一名称，则可以使用另一个选择器遍历表以放置值。

编辑：

 <td class="description"><textarea form ="testinsert" name="item_desc[0]">Residential Rate: Consulting/Labor/Installs</textarea></td>

$('[name="item_desc[0]"]');
$('[id="item_desc[0]"]');

通过动态名称元素填充动态JQuery字段

1 个答案: