动态字段-总计相加-每行 [英] Dynamic Fields - Adding for Total - Each Line

问题描述

我有一个问题，希望有人遇到可以帮助您.我有一个类似的问题已经发布(已解决)，但是在新问题上没有进一步的帮助，所以我认为我会发布该问题(抱歉，这是忌讳).

I have a problem I'm hoping someone has come across and can help. I had a similar question posted (solved), but have had no further help with a new issue, so I thought I'd post with that question (sorry if this is taboo).

      <table border="1" class="autoTable">
 <tr>

<td>Description</td><td>Stocked</td><td>Quantity</td><td>Part Price</td>
<td>Hours</td>    
<td>Rate Class</td><td>Total</td><td>Approved</td><td>Add New Row</td>    
<td>Remove Row</td></tr>
<tr>
<td><input name="description[]" id="description" value="<?php echo $description; ?>" size="55" class="numeric add_to_total" onKeyPress="return disableEnterKey(event)" />

</td><td align="center"><input type="checkbox"  name="stocked[]" id="stocked" value="<?php echo $stocked; ?>" size="5" class="numeric add_to_total" onKeyPress="return disableEnterKey(event)" />
</td><td><input name="quantity[]" id="quantity" value="<?php echo $quantity; ?>" size="5" class="numeric add_to_total quantity" onKeyPress="return disableEnterKey(event)" />
</td><td><input name="partPrice[]" id="partPrice" value="<?php echo $partPrice; ?>" size="10" class="numeric add_to_total part" onKeyPress="return disableEnterKey(event)" />
</td><td><input name="hours[]" id="hours" value="<?php echo $hours; ?>" size="10" class="numeric add_to_total hours" onKeyPress="return disableEnterKey(event)" />
</td><td><select name="rate[]" id="rate" class="numeric add_to_total rate" onKeyPress="return disableEnterKey(event)">
<?php
    //php code here for rates
?>
</select>
</td><td><input name="total[]" id="total" size="10" class="numeric is_total" onKeyPress="return disableEnterKey(event)" />
</td><td align="center"><input type="checkbox" name="approved[]" id="approved" value="<?php echo $approved; ?>" size="10" onKeyPress="return disableEnterKey(event)" />
</td><td align="center"><img src="img/plus.png" width="25" height="25" id="addButton" title="Add New Row" class="addRow" />
</td><td align="center"><img src="img/x.png" width="25" height="25" id="removeButton" title="Remove Row" class="delRow" />
</td></tr>
</table>

我使用以下代码将总计行相加，但不适用于第二个及以后的动态行.

I use the following code to add up the total row, but it doesn't work for the second and subsequent dynamic rows.

$(".add_to_total").change(function() {
    var total = 0;
    $(".add_to_total").each(function() {
        var quantity = parseFloat($(".quantity").val()) || 0;
        var part = parseFloat($(".part").val()) || 0;
        var hours = parseFloat($(".hours").val()) || 0;
        var rate = parseFloat($(".rate").val()) || 0;
        total = (Number(quantity) * Number(part)) + (Number(rate) * Number(hours));
    });
    $(".is_total").val(total);
});

我希望有人能帮助我...我已经尽了一切力所能及的事，我真的很想解决这个问题，继续我的生活:)

I'm hoping someone can help me...I've tried everything I can think of, and I really want to get this thing solved, and move on with my life :)

谢谢.

推荐答案

我看不到add_to_total，quantity，part，hours，rate或is_total所在的类您的HTML或您尝试在Javascript中尝试选择的元素...希望有帮助...

I don't see where the classes add_to_total, quantity, part, hours, rate or is_total are in your HTML, or which elements you're trying to select in your Javascript as a result...hope this helps...

再次考虑一下，这可能是由于新添加的行的add_to_total分类元素 not 不能更改事件.您是否考虑过使用.live()/.on() jQuery事件(取决于您所使用的jQuery版本)?

Thinking about it again, it might be as a result of the newly-added rows' add_to_total classed elements not being bound to change events. Have you considered using the .live() / .on() jQuery events (depending on what version of jQuery you're using)?

http://api.jquery.com/live/(jQuery< 1.7)

http://api.jquery.com/live/ (jQuery < 1.7)

http://api.jquery.com/on/(jQuery> = 1.7)

http://api.jquery.com/on/ (jQuery >= 1.7)

也许实现了这样的东西:

Maybe implemented something like this:

// using the .live() event...
$(".add_to_total").live('change', function(){ ... });

// using the .on() event...
$(".add_to_total").on('change', function(){ ... });

哈哈！希望最后编辑！好吧，考虑以下代码:

Haha! Hopefully the last edit! Well, considering the following code:

var quantity = parseFloat($(".quantity").val()) || 0;

这将始终返回 first $(".quantity")的值，尽管实际上选择了一组元素……这仅仅是jQuery中.val()函数的功能.您想要做的是像您所说的那样对每一行进行过程计算.简化后，您需要获取当前add_to_total的TR元素，仅关注其子元素，然后继续前进.

This will always return the first $(".quantity")'s value, although a set of elements is actually selected...this is just the functionality of the .val() function in jQuery. What you're looking to do is process calculations for each of the rows, like you said. Simplified, you need to get the TR element for the current add_to_total, only focus on its children, then move on.

显然，这正在处理大量不必要的计算，我建议向每个需要在其上运行计算并直接循环遍历的行中添加一个类:

Obviously this is processing a LOT of unnecessary calculations, and I would suggest rather adding a class to each of the rows which need to have calculations run on them and loop through them directly rather:

<tr class="dynamic_row"> ... </tr>

然后使用Javascript:

Then in the Javascript:

$(".add_to_total").on('change', function() {
    var total = 0;
    $(".dynamic_row").each(function() {
        var row = $(this);
        var quantity = parseFloat(row.find(".quantity").val()) || 0;
        var part = parseFloat(row.find(".part").val()) || 0;
        var hours = parseFloat(row.find(".hours").val()) || 0;
        var rate = parseFloat(row.find(".rate").val()) || 0;
        total = (Number(quantity) * Number(part)) + (Number(rate) * Number(hours));
    });
    row.find(".is_total").val(total);
});

希望这会有所帮助！ :)

Hope this helps! :)

这篇关于动态字段-总计相加-每行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！