Question

我有一个包含价格，数量和总字段的表格行。总字段根据用户输入的价格和数量自动汇总。

您可以在表格中动态创建/删除新行（产品），每个动态创建的行也将合计。

我还有一个应该总计所有字段的方框，但我遇到的问题是我不知道如何获取所有字段的值，因为每次都可能不同。

现在当一行更新时，它将更新变量＆＃34; total＆＃34;到该行的总和，这也将显示在总框中。

我想也许我可以将数字添加到数组中，但我不确定删除行时是否可行。

如何创建一个能够从表中创建总计所有总数的函数？

这是一个JSFiddle - http://jsfiddle.net/xntn7p5p/

由于

的JavaScript

var counter = 1;

jQuery('a.wei-add-service-button').click(function(event){
    event.preventDefault();
    counter++;
    var newRow = jQuery('<tr><td><input type="text" class="wei-add-field description ' + counter + '"/></td><td><input type="text" class="wei-add-field quantity ' + counter + '" /></td><td><input type="text" class="wei-add-field unit-price ' + counter + '"/></td><td><input type="text" value="" name="" placeholder="$0.00" class="wei-add-field price-total ' + counter + '" id=""/></td><td><a href="#">X</a></td></tr>');
    jQuery('table.order-details').append(newRow);
});


jQuery('table.order-details').on('click','tr a',function(e){
 e.preventDefault();
jQuery(this).parents('tr').remove();
});


jQuery('table.order-details').on("keyup", "tr", function() {
    var row = jQuery(this);
    var value = jQuery( ".unit-price", row ).val();
    var value2 = jQuery( ".quantity", row ).val();
    var total = value * value2;

    var lineTotal = jQuery( ".price-total." + counter + "2", row ).val();
    testArray[counter] = total;
    var test = testArray[counter];

    var grandTotal;

    for (var i = 0; i < testArray.length; i++) {
        grandTotal += testArray[i] << 0;
    }

    jQuery( ".wei-add-field.price-total", row ).val( '$' + total.toFixed(2) );
    jQuery(".wie-add-subtotal").text( '$' + test.toFixed(2));
  });

HTML

<table class="order-details">
    <tbody>
    <tr>
        <td><input type="text" value="" name="" placeholder="Work Description" class="wei-add-field description 1"/></td>
        <td><input type="text" value="" name="" placeholder="QTY" class="wei-add-field quantity 1" /></td>
        <td><input type="text" value="" name="" placeholder="$0.00" class="wei-add-field unit-price 1"/></td>
        <td><input type="text" value="" name="" placeholder="$0.00" class="wei-add-field price-total 1" id=""/></td>
        <td> </td>
    </tr>
    </tbody>
</table>

<div class="wei-add-service"><a href="#" class="button-secondary wei-add-service-button">Add Item</a></div>

<table class="wei-add-totals">
    <tr>
        <td width="50%">Sub Total</td>
        <td width="50%" class="wie-add-subtotal"> </td>
    </tr>
</table>

Answer 1

您希望在每个String copies = txtcopies.Text; int x = Convert.ToInt32(copies); int n = 0; string loadstring = @"server=localhost;database=librarys;userid=root;password=1234;"; MySqlConnection conDataBase = new MySqlConnection(loadstring); try { conDataBase.Open(); while (n < x) { MySqlCommand cmdDataBase = new MySqlCommand("SELECT func_add_book('" + this.lblbnum.Text + "','" + this.txtisbn.Text + "','" + this.txttitle.Text + "','" + this.txtauthor.Text + "','" + this.txtpublisher.Text + "','" + this.txtdate.Text + "','" + this.txtcost.Text + "');", conDataBase); string returnedValue = cmdDataBase.ExecuteScalar().ToString(); n++; ClearAllText(txtcopies); MessageBox.Show(returnedValue); } } Catch (Exception Ex) { } Finally { conDataBase.Close() }（或其他适当的事件）：

初始化keyup
每次计算grandTotal并将其添加到total
更新循环/迭代之外的grandTotal元素

代码看起来像这样：

grandTotal

DEMO

加号，如果删除了行，您可以进行进一步更改以刷新jQuery('table.order-details').on("keyup", "tr", function() { var grandTotal = 0; $(this).parent().find('tr').each(function() { var row = jQuery(this); var value = jQuery( ".unit-price", row ).val(); var value2 = jQuery( ".quantity", row ).val(); var total = value * value2; grandTotal += total; jQuery( ".wei-add-field.price-total", row ).val( '$' + total.toFixed(2) ); }); jQuery(".wie-add-subtotal").text( '$' + grandTotal.toFixed(2)); });：

将上面的代码放在函数grandTotal中并相应调整，
在reCalculate上调用该函数，并删除一行。

代码将是：

keyup

DEMO

如何动态创建字段

1 个答案: