I have the code below on an internal site I've built to handle some php
generated table data. The data is a mix of int, string, and date,
sometimes with markup in rows. The code all works, and it's relatively quick already, but sometimes javascript
will break and none of the filters will work. It won't throw any errors in firebug. All are in a (document).ready
statement in an external js
file. I've added comments before each statement that describe what they do. All filters trigger a row count that I tried, unsuccessfully, to make into a method.
//moves a graph from the bottom of the page where php puts it to the top.
//Clears the original DIV
var moving = $("#mover").html();
$("#mover").html('');
$("#target").html(moving);
//changes rows from red to green based on value
$(".late").each(function(){
var daySince = $(this).text();
var dateCheck = parseInt(daySince);
if(dateCheck<30&&daySince.toLowerCase().indexOf("xx")===-1){
$(this).css("color","#3FFF00");}
});
//filters rows on anchor click
$("#openOnly").click(function(){
$("tr").each(function(){
$(this).removeClass("hiddenCS");
});
$(".toCloseMark").each(function(){
$(this).addClass("hiddenCS");
});
var rowCount = $("tr:visible").length - 1;
$("#matching").val(rowCount).change();
});
//filters rows on anchor click
$("#closedOnly").click(function(){
$("tr").each(function(){
$(this).removeClass("hiddenCS closedMark");
});
$("tbody tr").not(".toCloseMark").each(function(){
$(this).addClass("hiddenCS");
});
var rowCount = $("tr:visible").length - 1;
$("#matching").val(rowCount).change();
});
//filters rows on anchor click
$("#allIssues").click(function(){
$("tr").each(function(){
$(this).removeClass("hiddenCS");
});
var rowCount = $("tr:visible").length - 1;
$("#matching").val(rowCount).change();
});
$("td:contains('Warranty')").each(function(){
$(this).parent().addClass("warr");
});
$("tbody tr").not(".warr").each(function(){
$(this).addClass("house");
});
//filters rows on anchor click
$("#inHouse").click(function(){
$(".warr, .house").each(function(){
$(this).removeClass("hiddenWC");
});
$(".warr").each(function(){
$(this).addClass("hiddenWC");
});
var rowCount = $("tr:visible").length - 1;
$("#matching").val(rowCount).change();
});
//filters rows on anchor click
$("#warranty").click(function(){
$(".warr, .house").each(function(){
$(this).removeClass("hiddenWC");
});
$(".house").each(function(){
$(this).addClass("hiddenWC");
});
var rowCount = $("tr:visible").length - 1;
$("#matching").val(rowCount).change();
});
//filters rows on anchor click
$("#allWorkcenter").click(function(){
$(".warr, .house").each(function(){
$(this).removeClass("hiddenWC");
});
var rowCount = $("tr:visible").length - 1;
$("#matching").val(rowCount).change();
});
//removes some formatting that de-emphasizes some rows
$("#shower").click(function(){
$(".toCloseMark").each(function(){
if($(this).hasClass('closedMark')){
$(this).removeClass('closedMark');
$("#shower").html("Reduce Closed");
}
else{
$(this).addClass('closedMark');
$("#shower").html("Show Closed");
}
});
var rowCount = $("tr:visible").length - 1;
$("#matching").val(rowCount).change();
});
//Shows some graphing
$("#showStats").click(function(){
$("#target").toggle("slow");
});
//filters rows based on text input. Will always be involved in a crash
//#col is a select, #val is text input
$('#add').click(function() {
var col = $("#col").val();
var val = $("#value").val();
$('#viewNCR').multiFilter({ column: col, word: val });
var rowCount = $("tr:visible").length - 1;
$("#matching").val(rowCount).change();
});
//resets text based input
$('#reset').click(function(){
var col = $("#col").val('Part Number');
$("#value").val('');
var val = $("#value").val();
$('#viewNCR').multiFilter({ column: col, word: val });
var rowCount = $("tr:visible").length - 1;
$("#matching").val(rowCount).change();
});
//styles a sum based on
var avgDays = $("#avgDays").html();
$("#daysOut").html(avgDays);
var daysOut = $("#daysOut").html();
if(daysOut<30){
$("#daysOut").css("color","#3FFF00");
}
else{$("#daysOut").css("color","#FF0000");}
//counts displayed rows
$("#matching").change(function(){
var entrySum = $("tbody tr:visible").length;
$("#entrySum").html(entrySum);
//sums displayed values in rows
var qtySum =0;
$("tbody tr:visible :nth-child(6)").each(function(){
var partQTY = $(this).text();
qtySum += parseInt(partQTY);
});
$("#qtySum").html(qtySum);
//sums values in rows
var creditSum=0;
$("tbody tr:visible :nth-child(12)").each(function(){
var creditQTY = $(this).text();
creditSum += parseInt(creditQTY);
});
$("#creditSum").html(creditSum);
});
.each
is one line, you don't even need the.each
.$("tr").removeClass("hiddenCS")
will apply to alltr
on the page. – James P. Wright Dec 20 '12 at 20:17dataTables
or something similar – Andy Foster Dec 21 '12 at 12:10