We Keep Coding

Datatables deleting a row where column value equals something

I have tried the following and I am unable to find a match. What am I doing wrong?
var table = $('#mytable').DataTable();
//hide the row where text in column 1 equals 202733001010
var index = table.row().eq( 0 ).filter( function (rowIdx) {
return table.cell( rowIdx, 0 ).data() === '202733001010' ? true : false;
} );
What i get is a convoluted empty array that does not seem to have any values in it. My end purpose is to delete a row where a column cell (in this case 0) equals a certain value but I think I may be using an incorrect approach. Many thanks in advance for your suggestions. Datatables documentation : https://datatables.net/reference/type/row-selector

If your goal is to actually remove the row (filter and search just hides/shows matching data), the logic below can do it fairly straight forward. I use a text box to enter a value to get ride of out of the first column. If found, I remove it.
See it work here http://live.datatables.net/natejiju/1/edit
$(document).ready( function () {
var table = $('#example').DataTable();
$("#btnGo").on("click", function(){
var s = $("#txtSearch").val();
table.rows().nodes().each(function(a,b) {
if($(a).children().eq(0).text() == s){
table.rows(a).remove();
}
} );
table.rows().invalidate();
table.draw();
});
});

jquery function on same classes

I have a page where I have a table with a class. This table sometimes occurs multiple times on the page. I need to do the same jquery function on each instance. How do I achieve that with jquery...???
Here is my jquery:
jQuery(window).load(function () {
if(jQuery('.ezfc-summary-table tr:eq(2) td:eq(1)').text()=='1 layer'){
jQuery('.ezfc-summary-table tr:eq(5)').hide();
jQuery('.ezfc-summary-table tr:eq(6)').hide();
jQuery('.ezfc-summary-table tr:eq(8)').hide();
}
});
#devlin carnate - i'm trying to do another thing, which is to take the text from one of the td's and append it to another class (product-title), which also appears multiple times. Here is what i have tried, but it only takes the text from the first td it finds, and appends it to all the following classes.
$(document).ready(function() {
$('.ezfc-summary-table').each(function(i, obj) {
var table = $(this);
if (table.find('tr').eq(2).find('td').eq(1).text() == '1 layer') {
table.find('tr').eq(5).hide();
table.find('tr').eq(6).hide();
table.find('tr').eq(8).hide();
var getpartname = $('.ezfc-summary-table tr:eq(0) td:eq(1)').text();
$('.product-title').append('<span style="padding-left: 5px;">'+getpartname+'</span>');
}
});
});
Could you help me solve this problem also...???
Thanks in advance

You can iterate over the class assigned to the tables using jQuery $.each() and hide the rows based on whether the '1 layer' text condition is met:
$(document).ready(function() {
$('.ezfc-summary-table').each(function(i, obj) {
var table = $(this);
if (table.find('tr').eq(2).find('td').eq(1).text() == '1 layer') {
table.find('tr').eq(5).hide();
table.find('tr').eq(6).hide();
table.find('tr').eq(8).hide();
}
});
});
Here is a Fiddle Demo : https://jsfiddle.net/zephyr_hex/f45umhkp/2/

Remove rows from a table which I collected from a loop (JQuery)

I have a table that I loop with JQuery in order to find rows that match certain conditions:
$('#sometable').find('tr').each(function () {
var row = $(this); //<----
if(row.find('input[type="checkbox"]').is(':checked')) {
//etc
}
}
My question is, is there a way to remove each matched row? I mean is there a way to collect these row variables inside my if(row.find('input[type="checkbox"]').is(':checked')) so that I can remove the specific rows from my table directly?
Note that my rows don't have a unique id

You may want:
$('#proposedtable tr:contains(input:checkbox:checked)').remove();
or
$('#proposedtable input:checkbox:checked').closest('tr').remove();

Try this:
var filteredRows = $('#sometable').find('tr').filter(function(){
return $(this).find('input[type="checkbox"]').is(':checked'));
});
$(filteredRows).remove();
The above function will gather all the rows(tr) and then filter those rows based on the checked state of checkbox. Later the filtered rows will be removed.
To make it as array, use Array.prototype.slice.call()
var arrFilteredRows = Array.prototype.slice.call(filteredRows);

Is this help you ?
http://jsfiddle.net/LGdA3/
<pre><code>
$('input#myButton').on('click', function(){
$('table#someTable td input[type="checkbox"]:checked').each(function(){
$(this).parents('tr').first().remove();
});
});
</code></pre>

What's the smartest way to select specific table elements in javascript?

I've got a table with hidden rows on it, like such
-visible-
-invisible-
-visible-
-invisible-
When I click on a table row, I want it to show the invisible row. Currently I have that using this function:
var grid = $('#BillabilityResults');
$(".tbl tr:has(td)").click(
function () {
$(grid.rows[$(this).index()+1]).toggle();
}
However, this table also hides the visible rows if I click on one of the (now visible) hidden rows.
I'd like the click function to only work on the specific visible rows. Currently all my invisible rows have the class "even" so I figured I could limit the click based on that. However, I can't seem to find the syntax to explain that to my function. How would I go about doing that? And, more importantly, is there a better way to approach this?

Use next:
$(".tbl tr:has(td)").click(
function () {
$(this).next().toggle();
}
);
And also if you have specific selector for odd or even:
$(".tbl tr.odd").click(
function () {
$(this).next().toggle();
}
);
But I think that the major help with my answer is to use next() that get you the next row, instead of the index process that you were doing.

var grid = $('#BillabilityResults');
$(".tbl tr:visible").click(
function () {
$(this).next('tr').toggle();
});

Use the NOT function to disregard the EVEN tr elements:
http://jsfiddle.net/7AHmh/
<table class="tbl">
<tr><td>one</td></tr>
<tr class="even" style="display:none"><td>two</td></tr>
<tr><td>three</td></tr>
<tr class="even" style="display:none"><td>four</td></tr>
</table>​
$(".tbl tr:has(td)").not("tr.even").click(function() {
alert("Click triggered.");
$(this).next("tr").show();
});

I guess you could check for even/odd rows with the modulus operator before calling your toggling code:
function() { // your anonymous function
if (rowNumber % 2 == 0) { // only even rows get through here
// toggle code here
}
}
I hope it helps.

Hide a table row with filtering jquery

I have the following example http://jsfiddle.net/zidski/MxqRu/1/
When you click on 2010 I need valuation to disappear with the list items.
Here is the code which I am using to do this:
$("#yearfilter a").live("click", function(e) {
e.preventDefault();
//var v = $(this).val();
var v = $(this).attr("data-value");
if(v.length > 0) {
$('tr.reports').show();
$('tr.reports ul').hide();
$('tr.reports ul.year-'+v).show();
$('tr.reports').each(function() {
if($('ul:visible', this).size() == 0) {
$(this).hide();
}
});
} else {
$('tr.reports').show();
$('tr.reports ul').show();
}
});

I have done it in my project something like this:
function toggleRow(row_id) {
row_selector = "#row_" + row_id;
$(row_selector).toggleClass("shown hidden")
}
Then in the CSS:
.hidden {display:none;}
.shown {}
Then in the HTML I have alternating table rows, where the odd rows act as headings for the content in the even rows. Clicking an odd row toggles the visibility of the corresponding even row.
...
<tr onclick="toggleRow(17)">...</tr>
<tr class="hidden" id="row_17">...</tr>
...

Give each tr an ID something like id="row_2010" then look for that and hide the whole entire row at once.
UPDATE
I would strongly suggest not using so many tables and use more classes to classify your data structure. It would help your javascript be much more clean, concise and function easier.
UPDATE
I adjusted all your javacsript and some of your html. Here is a fully working example jsFiddle Demo