jquery table additions TRIAL
by Joe Saad
HTML
<table border="1" bordercolor="#FFCC00" width="400">
<tr>
<th>Table Col 1</th>
<th>Table Col 2</th>
<th>Table Col 3</th>
<th>Table Col 4</th>
</tr>
<tr>
<td>00</td>
<td><input type="text" /></td>
<td><input type="text" /></td>
<td><input type="text" /></td>
</tr>
<tr>
<td>10</td>
<td><input type="text" /></td>
<td><input type="text" /></td>
<td><input type="text" /></td>
</tr>
<tr>
<td>20</td>
<td><input type="text" /></td>
<td><input type="text" /></td>
<td><input type="text" /></td>
</tr>
<tr class="totals">
<td>Totals</td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
CSS
input {width:35px;}
JavaScript
$(document).ready(function(){
$("th").click(function(){
alert($(this).index());
});
var total = 0;
var totals=new Array();
for (y=0;y<=5;y++){
totals[y]= 0;
}
$("input").blur(function(){
var col = $(this).parents("tr").children("td").index($(this).parent());
// alert("col is: "+col);
var modCol = col+1;
// alert("modCol"+modCol);
var row = $(this).parents("tr").index();
//alert("row:"+ row + " col:"+col);
//alert("value is "+$(this).val());
// $("td:nth-child("+col+")").each(function(){
// alert("Col values is "+$(this).val());
// total = parseFloat($(".totals td:nth-child("+col+")").text());
// alert("total befre "+total);
// total = parseFloat(total) + parseFloat($("input").val());
// alert(total);
// $(".totals td:nth-child("+modCol+")").text(total);
// total = 0;
// });
/*
$("tr").each(function(){
alert("total befre "+total);
total = total + parseInt($("td:nth-child("+col+") input").val());
alert(total);
$(".totals td:nth-child("+modCol+")").text(total);
});
*/
/*
$("input").parent("td:nth-child("+col+")").each(function(i){
alert("total befre "+total);
total = parseInt(total) + parseInt($("input").index(i).val());
alert(total);
alert("value of inputs"+ $(this).val());
$(".totals td:nth-child("+col+")").text(total);
});
*/
//alert(this.value);
totals[col] = parseInt(totals[col])+ parseInt(this.value);
alert(totals[1]);
//total = parseInt(total) + parseInt(this.value);
$(".totals td:nth-child("+modCol+")").text(totals[col]);
});
});