Searching a table row for specific text in a COLUMN with jQuery

Question

I found this question on StackOverflow that has a very nice answer, but being a beginner, I want a more detailed explanation, because my situation is a bit different: I have a table like the one below:

 ________________________________________________
 | id |     name     | age |      location      |
 |----+--------------+-----+--------------------|
 |  1 | Victor       | 14  | Bucharest, Romania |
 |  2 | John         | 17  | New York, USA      |
 |  3 | Steve        | 12  | New York, USA      |
 |  7 | Michael      | 37  | Washington DC, USA |
 |  9 | Michaela     | 25  | Washington DC, USA |
 |----+--------------+-----+--------------------|

The id of the person is in my database (MySQL database) set to AUTO_INCREMENT, so if I delete a record, it will be like the last one in my table here (from 7 to 9). I want to search the row that has the personId = 3 in my HTML table.

So, based on the question in my link, how can I refine that search to be only in the ID column?

Edit for @yeyene:

This is the function based on your code. Actually, I don't need to change the background color of the row, I need the row's index for using it later with .eq(index) to make some operations on it:

function findTableRow(personId){
    $('#people tr').each(function(){
        if($(this).find('td').eq(0).text() == personId){
            return (row's index?)
        }
    }); 
}

How about you show us your code and what you have already tried doing? — achudars
– achudars, Commented Jul 26, 2013 at 7:14
From Wikipedia: jQuery is a multi-browser (cf. cross-browser) JavaScript library designed to simplify the client-side scripting of HTML. jQuery is not for querying databases. The link you post refers to an HTML table not a database table. — Matt Harrison
– Matt Harrison, Commented Jul 26, 2013 at 7:17

yeyene · Accepted Answer · 2013-07-26 07:35:39Z

14

Check here, DEMO http://jsfiddle.net/yeyene/wAxNu/

$(document).ready(function(){
    $('table tr').each(function(){
        if($(this).find('td').eq(0).text() == '3'){
            $(this).css('background','red');
        }
    });
});

answered Jul 26, 2013 at 7:35

yeyene

7,4001 gold badge24 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Victor Over a year ago

please, take a look at my edit. actually it is my fault, I should have explained my situation briefly for you to give a good answer :)

Victor Over a year ago

with your code, I only need to add return $(this).index() thanks

Volatil3 Over a year ago

Any shorter version of this? seems :contains() does not work for such kind of work.

Pieter · Accepted Answer · 2013-07-26 07:25:59Z

4

You can achieve that with your database query:

SELECT (id, name, age, location) FROM table WHERE id = 3;

If you want to use filters on page, you can you the first answer of your posted question:

var tableRow = $("td").filter(function() {
    return $(this).text() === "3";
}).closest("tr");

Explanation:

Make a var tableRow
Find all cells with $("td")
Filter the found cells based on a function, this is testing whether the content of the cell is equal to '3'. $(this) refers to the cell, .text() outputs the text content.
closest("tr") is added to select the tr where the td is placed in.
If you want to do something with that row, you can do this: tablerow.hide().

To hide all rows, but not the selected row, use this code:

$('tr').not(tableRow).hide();

Working demo: http://jsfiddle.net/hzW2a/

edited Jul 26, 2013 at 7:25

answered Jul 26, 2013 at 7:20

Pieter

1,8431 gold badge12 silver badges16 bronze badges

1 Comment

Victor Over a year ago

I cannot achieve that with my database query, because I need to add a class on that found row :)

Collectives™ on Stack Overflow

Searching a table row for specific text in a COLUMN with jQuery

2 Answers 2

3 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related