Tengo que aclarar que las columnas contienen espacios vacíos ya que hay una columna para Banco y otra Efectivo, por lo tanto cuando se paga o cobra por banco no se llena la columna efectivo, quizás esta dando error por eso... también necesito que reste las que son salidas de dinero y sume las que son entrada del mismo, paso el código a continuación y una captura de la vista en la web... desde ya muchas gracias!
Acá el código JS que esta al final de la vista, lo encontre aca en stack overflow, utiliza jquery y va sumando y concatentando valores de las columnas de la tabla:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
//Ejecuto la función al cargar la página
$(document).ready(function () {
var total_col3 = 0;
var total_col4 = 0;
$('#tablaCaja tbody').find('tr').each(function (i, el) {
total_col3 += parseFloat($(this).find('td').eq(3).text());
total_col4 += parseFloat($(this).find('td').eq(4).text());
});
$('#tablaCaja tfoot tr th').eq(3).text("Total: " + total_col3);
$('#tablaCaja tfoot tr th').eq(4).text("Total: " + total_col4);
});
</script>
Aqui tengo el codigo de la tabla, le puse correctamente la ID, y dividi head body y foot para usar los totales en el foot, tal cual explicaba el metodo del script.
<table id="tablaCaja" class="table table-striped table-bordered table-condensed table-hover">
<thead>
<tr>
<th>
@Html.DisplayNameFor(model => model.Fecha)
</th>
<th>
Transaccion
</th>
<th>
Inmueble
</th>
<th>
Efectivo
</th>
<th>
Banco
</th>
<th>
@Html.DisplayNameFor(model => model.Observaciones)
</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
{
var badgeClass = item.esIngreso == true
? "success"
: "danger";
<tr class="@badgeClass">
<td>
@Html.DisplayFor(modelItem => item.Fecha)
</td>
<td>
@Html.DisplayFor(modelItem => item.concepto.Descripcion)
</td>
<td>
@if (item.ConceptoFK != 5)
{
@Html.DisplayFor(modelItem => item.inmueble_Referencia.Calle) @Html.Raw(" ") @Html.DisplayFor(modelItem => item.inmueble_Referencia.Altura) @Html.Raw(" ") @Html.DisplayFor(modelItem => item.inmueble_Referencia.NroPiso) @Html.Raw(" ") @Html.DisplayFor(modelItem => item.inmueble_Referencia.Departamento)
}
</td>
@if (item.esEfectivo == true)
{
<td>
@Html.DisplayFor(modelItem => item.MontoTotal)
</td>
}
else
{
<td></td>
}
@if (item.esEfectivo == false)
{
<td>
@Html.DisplayFor(modelItem => item.MontoTotal)
</td>
}
else
{
<td></td>
}
<td>
@Html.DisplayFor(modelItem => item.Observaciones)
</td>
<td>
@Html.ActionLink(" ", "Details", new { id = item.ID }, new { @class = "btn btn-primary fa fa-folder btn-sm", title = "Detalles" })
</td>
</tr>
}
</tbody>
<tfoot>
<tr class="total">
<th></th>
<th></th>
<th></th>
<th>total_col3</th>
<th>total_col4</th>
</tr>
</tfoot>
</table>
Añado al final el codigo html del body:
<tbody>
@foreach (var item in Model)
{
var badgeClass = item.esIngreso == true
? "success"
: "danger";
<tr class="@badgeClass">
<td>
@Html.DisplayFor(modelItem => item.Fecha)
</td>
<td>
@Html.DisplayFor(modelItem => item.concepto.Descripcion)
</td>
<td>
@if (item.ConceptoFK != 5)
{
@Html.DisplayFor(modelItem => item.inmueble_Referencia.Calle) @Html.Raw(" ") @Html.DisplayFor(modelItem => item.inmueble_Referencia.Altura) @Html.Raw(" ") @Html.DisplayFor(modelItem => item.inmueble_Referencia.NroPiso) @Html.Raw(" ") @Html.DisplayFor(modelItem => item.inmueble_Referencia.Departamento)
}
</td>
@if (item.esEfectivo == true)
{
<td>
@Html.DisplayFor(modelItem => item.MontoTotal)
</td>
}
else
{
<td></td>
}
@if (item.esEfectivo == false)
{
<td>
@Html.DisplayFor(modelItem => item.MontoTotal)
</td>
}
else
{
<td></td>
}
<td>
@Html.DisplayFor(modelItem => item.Observaciones)
</td>
<td>
@Html.ActionLink(" ", "Details", new { id = item.ID }, new { @class = "btn btn-primary fa fa-folder btn-sm", title = "Detalles" })
</td>
</tr>
}
</tbody>