I'm not much of a javascript coder, but I'm trying to write something to make my work a little easier...
I have a table of data. The third cell of the table ('offersTable') is a display flag, which will either be 'Y', 'N', or empty. The source for the table is incomplete, which is why sometimes the cell is empty (null).
I'm trying to write a small script that will iterate down through the table, and then set the row to hide if the value if the cell is either 'N' or null. That way, only rows which have a 'Y' remain.
Please can someone help me? I'm going out of my mind trying to work this one out!
Sorry, I should have included my code...
<table id="offersTable">
<tr>
<th onclick="sortTable(0)">Lender</th>
<th onclick="sortTable(1)">Lender Code</th>
<th onclick="sortTable(2)">Display</th>
<th onclick="sortTable(3)">Loan Offered</th>
<th onclick="sortTable(4)">Term Offered</th>
<th onclick="sortTable(5)">Approval Probability</th>
<th onclick="sortTable(6)">APR</th>
<th onclick="sortTable(7)">Monthly Repayment</th>
<th onclick="sortTable(8)">Total Repayable</th>
</tr>
<tr id="lender1">
<td id="lender1Name"><script>document.getElementById("lender1Name").innerHTML = offers[0].lender_name;</script>
</td>
<td id="lender1Code"><script>document.getElementById("lender1Code").innerHTML = offers[0].lender_code;</script>
</td>
<td id="lender1Display"><script>document.getElementById("lender1Display").innerHTML = offers[0].display;</script>
</td>
<td id="lender1Value"><script>document.getElementById("lender1Value").innerHTML = offers[0].loan_offered;</script>
</td>
<td id="lender1Term"><script>document.getElementById("lender1Term").innerHTML = offers[0].term_offered;</script>
</td>
<td id="lender1AppProb"><script>document.getElementById("lender1AppProb").innerHTML = offers[0].approval_probability;</script>
</td>
<td id="lender1APR"><script>document.getElementById("lender1APR").innerHTML = offers[0].apr;</script>
</td>
<td id="lender1MonthlyRepay"><script>document.getElementById("lender1MonthlyRepay").innerHTML = offers[0].monthly_repayment;</script>
</td>
<td id="lender1TotalRepay"><script>document.getElementById("lender1TotalRepay").innerHTML = offers[0].total_repayment;</script>
</td>
</tr>
<tr id="lender2">
<td id="lender2Name"><script>document.getElementById("lender2Name").innerHTML = offers[1].lender_name;</script>
</td>
<td id="lender2Code"><script>document.getElementById("lender2Code").innerHTML = offers[1].lender_code;</script>
</td>
<td id="lender2Display"><script>document.getElementById("lender2Display").innerHTML = offers[1].display;</script>
</td>
<td id="lende2Value"><script>document.getElementById("lender2Value").innerHTML = offers[1].loan_offered;</script>
</td>
<td id="lender2Term"><script>document.getElementById("lender2Term").innerHTML = offers[1].term_offered;</script>
</td>
<td id="lender2AppProb"><script>document.getElementById("lender2AppProb").innerHTML = offers[1].approval_probability;</script>
</td>
<td id="lender2APR"><script>document.getElementById("lender2APR").innerHTML = offers[1].apr;</script>
</td>
<td id="lender2MonthlyRepay"><script>document.getElementById("lender2MonthlyRepay").innerHTML = offers[1].monthly_repayment;</script>
</td>
<td id="lender2TotalRepay"><script>document.getElementById("lender2TotalRepay").innerHTML = offers[1].total_repayment;</script>
</td>
</tr>
<tr id="lender3">
<td id="lender3Name"><script>document.getElementById("lender3Name").innerHTML = offers[2].lender_name;</script>
</td>
<td id="lender3Code"><script>document.getElementById("lender3Code").innerHTML = offers[2].lender_code;</script>
</td>
<td id="lender3Display"><script>document.getElementById("lender3Display").innerHTML = offers[2].display;</script>
</td>
<td id="lender3Value"><script>document.getElementById("lender3Value").innerHTML = offers[2].loan_offered;</script>
</td>
<td id="lender3Term"><script>document.getElementById("lender3Term").innerHTML = offers[2].term_offered;</script>
</td>
<td id="lender3AppProb"><script>document.getElementById("lender3AppProb").innerHTML = offers[2].approval_probability;</script>
</td>
<td id="lender3APR"><script>document.getElementById("lender3APR").innerHTML = offers[2].apr;</script>
</td>
<td id="lender3MonthlyRepay"><script>document.getElementById("lender3MonthlyRepay").innerHTML = offers[2].monthly_repayment;</script>
</td>
<td id="lender3TotalRepay"><script>document.getElementById("lender3TotalRepay").innerHTML = offers[2].total_repayment;</script>
</td>
</tr>
<tr id="lender4">
<td id="lender4Name"><script>document.getElementById("lender4Name").innerHTML = offers[3].lender_name;</script>
</td>
<td id="lender4Code"><script>document.getElementById("lender4Code").innerHTML = offers[3].lender_code;</script>
</td>
<td id="lender4Display"><script>document.getElementById("lender4Display").innerHTML = offers[3].display;</script>
</td>
<td id="lender4Value"><script>document.getElementById("lender4Value").innerHTML = offers[3].loan_offered;</script>
</td>
<td id="lender4Term"><script>document.getElementById("lender4Term").innerHTML = offers[3].term_offered;</script>
</td>
<td id="lender4AppProb"><script>document.getElementById("lender4AppProb").innerHTML = offers[3].approval_probability;</script>
</td>
<td id="lender4APR"><script>document.getElementById("lender4APR").innerHTML = offers[3].apr;</script>
</td>
<td id="lender4MonthlyRepay"><script>document.getElementById("lender4MonthlyRepay").innerHTML = offers[3].monthly_repayment;</script>
</td>
<td id="lender4TotalRepay"><script>document.getElementById("lender4TotalRepay").innerHTML = offers[3].total_repayment;</script>
</td>
</tr>
</table>
<table>
<tr>
<td>Header A</td>
<td>Header B</td>
<td>Filtered to</td>
</tr>
<tr>
<td>Info A 1</td>
<td>Info B 1</td>
<td>Y</td>
</tr>
<tr>
<td>Info A 2</td>
<td>Info B 2</td>
<td>N</td>
</tr>
<tr>
<td>Info A 3</td>
<td>Info B 3</td>
<td>N</td>
</tr>
<tr>
<td>Info A 4</td>
<td>Info B 4</td>
<td>Y</td>
</tr>
<tr>
<td>Info A 5</td>
<td>Info B 5</td>
<td>N</td>
</tr>
</table>
<table>
<tr>
<td>Header A</td>
<td>Header B</td>
<td>Filtered to</td>
</tr>
<tr>
<td>Info A 1</td>
<td>Info B 1</td>
<td>Y</td>
</tr>
<tr>
<td>Info A 2</td>
<td>Info B 2</td>
<td>N</td>
</tr>
<tr>
<td>Info A 3</td>
<td>Info B 3</td>
<td>Y</td>
</tr>
<tr>
<td>Info A 4</td>
<td>Info B 4</td>
<td>N</td>
</tr>
<tr>
<td>Info A 5</td>
<td>Info B 5</td>
<td>N</td>
</tr>
</table>
<script>
function filterTable(table, cellIndex, filter) {
for (var i = 1, tr; tr = table.rows[i]; i++) { // skip first line
var third_td = tr.cells[cellIndex];
tr.style.display = third_td.innerText === filter ? '' : 'none';
}
}
function filterAllTables(cellIndex, filter) {
var tables = document.getElementsByTagName('table');
if (tables.length > 0) {
for (var i = 0, table; table = tables[i]; i++) {
filterTable(table, cellIndex, filter);
}
}
}
window.addEventListener('load', function () {
filterAllTables(2, 'Y');
});
</script>