Filtered Table 1

From the point of terminology, a 'Filtered Table' is the table that has mechanism for searching a data by particular field. It will be our next step.
For these 2 tables I applied just a 'Searching through all visible data in the table'.
An exception is the <input> fields, due to an absent of supporting by the native functions: innerText for IE and innerContent for the rest of the modern browsers for these kind of html elements.
If such behavior of the searching is absolutely necessary, you have to create the custom getInnerText function.

In order to make our table(s) searchable we have to:

	1. Create an <input> field in your markup (in any place of your page).
	2. Add an unique ID to this input (in my case it is: search_1, 
	   and search_2 for each table accordingly).
	3. Add this ID as parameter for configuration: 
	   searchInputId: 'search_1'
	4. Optionally you can create a <button> (or <input type="button" id="...) 
	   with unique ID,	and send this ID as a parameter for configuration:
	   searchGoButton: 'searchGo_1'
	5. Create a css class (the default name is noDisplay) with the only one 
	   css statement "display:none".
	   If you class has a different name than default one, you have to specify it: 
	   noDisplay:'some_class'.

If you have several tables on the page, create the <input> and the <button> html elements for each of them.

Alpha Content	Numeric	Date	Money	Not Sorted	Custom Sort
String 1	1	06/01/09	$120.00	Not Sorted	Tuesday
String 2	8	05/01/09	$100.00	Not Sorted	Monday
String 3	5	05/11/09	$110.00	Not Sorted	Sunday
String 4	-2	06/11/09	$10.00	Not Sorted	Friday
String 5	-6	06/11/08	$10.01	Not Sorted	Friday

First Name	Last Name	Age	Registration Day	Y/N/U
Adam	Abc	70	Jan 30, 2009, 10:50:23	Yes
Adam	Abc	12	Jan 30, 2009, 10:50:21	No
Adam	Adams	70	Jan 30, 2009, 12:50:23	Unknown
Jon	Abc	9	Feb 28, 2008, 10:50:23	Yes
Jon	Ring	11	Jun 1, 2009, 10:50:23	no

That is all. Try to insert some pattern into the input box and press ENTER (or click 'Search' button).
Wait, you can insert the several white space separated patterns and see the searching result. The default condition for the two or more patterns is AND.
You can overwrite it by configuration parameter: andFlag: false, or create an <select> box and manage this behavior dynamically.
The default searching is: fresh_search: true. If you change this parameter for false the new searching will be apply only for the visible part of the data from previously searching result (that has no sense if the andFlag is false).

In case if the searching returns no record the message 'No Record Found' from the table <caption> is displayed.
Our favorite IE displays the caption above the table header line. If you want to manage such situation do next:
After closing tag of your table (or any place) create an empty div. Example: <div id="noRecordPlaceHolder"></div>
Send the ID of the div in config: noRecordFoundId: 'noRecordPlaceHolder'.
The message 'No Record Found' will be placed into this div instead of the table caption.
To change this message itself add parameter: noRecordMsg: 'my Message for Empty Table.' for configuration.
If you not specify the css class name for this div (or the table caption) the default class name is: searchTableCaption.

See next page if you need the real 'Filtered Table'. Filtered Table 2

Filtered Table 1.