How is :contains() supposed to be used?

Question

I'm new to jQuery, but just attempting to create a function I can use to filter a table. I've got the table set up so that I can select all the rows by the class (which works fine) and call each() on the result. Inside the callback to each() I've got this if statement:

if ($(this).find("td[name=firstName]:contains('ke')").size() > 0)

However it doesn't find a match when I know it's there. If I take out the contains() call it does find the table cell, however so I'm really not sure what's wrong. Unfortunately (for me) this could be as simple as using the wrong syntax... :(

The end result would be to have a variable for the selector string, but since even using the string directly isn't working...

Answer 1

replace .size() with .length

also check that it is finding lowercase 'ke'

Answer 2

This is working for me (http://jsfiddle.net/dactivo/PHMkx/).

It looks for a td with an attribute "name" with value "FirstName" and inside the td, that's to say, the html inside td, contains the string "prueba". size() or length here both work.

<table><tr><td name="FirstName"><a class="edit">prueba</a> </td></tr></table>

$(document).ready(function(){

    if ($("table:eq(0)").find("td[name=FirstName]:contains('prueba')").size() > 0)
  {
      alert("yes");
  }

});

Answer 3

You could extend jQuery's selectors with this:

$.expr[':'].icontains = function(obj, index, meta, stack){
return (obj.textContent || obj.innerText || jQuery(obj).text() || '').toLowerCase().indexOf(meta[3].toLowerCase()) >= 0;
};

That would give you a new pseudo-selector :icontains(text) that works like :contains(text), but case-insensitive.

See: Comment Section on jQuery's documentation page for :contains(text)