[英]how can I sum selected checkbox(s) row values?
我在asp.net mvc中有一个表。 在此表中,每行都有一个复选框。 我想在选中一个复选框时在该行中找到工资值,并将其与选中的其他行的工资相加。 我想通过Jquery或Java脚本执行此总和。
@foreach (var item in Model)
{
<tr id="rowid">
<td>
<input type="checkbox" name="chk-@intCount" id="chk-@intCount" class="chkclass" />
</td>
<td>
@Html.DisplayFor(modelItem => item.Name)
</td>
<td>
@Html.DisplayFor(modelItem => item.TechnicalNo)
</td>
<td class="sum" id="wagein">
@Html.DisplayFor(modelItem => item.Wage)
</td>
<td class="sum" id="time">
@Html.DisplayFor(modelItem => item.Time)
</td>
</tr>
}
这是我在asp.net mvc中的代码。 我现在该如何计算工资和时间中的检查值?
编辑:
我的jQuery代码:
<script src="/Scripts/jquery-1.4.4.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('.chkclass').click(function() {
var sum = 0;
$('.chkclass:checked').each(function() {
sum += parseFloat($(this).closest('tr').find('.wagein').text());
});
$('#sum').html(sum);
});
});
</script>
我的html代码:
<tr>
<td>
<input type="checkbox" name="chk-1" id="chk-1" class="chkclass" />
</td>
<td class="sum wagein">
10
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="chk-2" id="chk-2" class="chkclass" />
</td>
<td class="sum wagein">
10
</td>
</tr>
任何想法 ?! 问题是什么 ?!
首先修复标记严重损坏的问题。 请记住,id在整个HTML文档中必须是唯一的:
@foreach (var item in Model)
{
<tr>
<td>
<input type="checkbox" name="chk-@intCount" id="chk-@intCount" class="chkclass" />
</td>
<td>
@Html.DisplayFor(modelItem => item.Name)
</td>
<td>
@Html.DisplayFor(modelItem => item.TechnicalNo)
</td>
<td class="sum wagein">
@Html.DisplayFor(modelItem => item.Wage)
</td>
<td class="sum">
@Html.DisplayFor(modelItem => item.Time)
</td>
</tr>
}
那么您可以订阅复选框的.click()
事件并累积所有工资的总和:
$(function() {
$('.chkclass').click(function() {
var sum = 0;
$('.chkclass:checked').each(function() {
sum += parseFloat($(this).closest('tr').find('.wagein').text());
});
alert(sum);
});
});
这是一个现场演示,可以实际操作: http : //jsfiddle.net/pbkjr/
好的,从显示的标记开始,用<table></table>
标记正确包装,下面有一个div来显示总数:
<table>
<tr>
<td>
<input type="checkbox" name="chk-1" id="chk-1" class="chkclass" />
</td>
<td class="sum wagein">
10
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="chk-2" id="chk-2" class="chkclass" />
</td>
<td class="sum wagein">
10
</td>
</tr>
</table>
<div id="total"></div>
单击任何复选框时,以下jquery(@Darin编写)将汇总所有选中的行:
$('.chkclass').click(function() {
var sum = 0;
$('.chkclass:checked').each(function() {
sum += parseFloat($(this).closest('tr').find('.wagein').text());
});
$('#total').html(sum);
});
这与Darin的原始版本非常接近,只不过我更改了最后一行以将total输出到id为total
的div。 这似乎比将总和写入每一行更有可能!
在下面的实时示例中可以看到: http : //jsfiddle.net/ADE3a/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.