echarp's blog

JavaScript filter/search in table

2006-06-18 12:13:47+0200

I’m so happy with myself, I want to share some nice and easy code that can search and filter in a table.

Simple, nothing to add in your html but for the javascript file and a simple filterable class to set onto tables and to define with a color (or any other style you want).


	<style>
		.highlighted { background: yellow; }
	</style>
	<script type="text/javascript"
		src="attachment/file/filterTable/filterTable.js"></script>

	<table class="filterable">
		<thead>
			<tr>
				<th></th>
				<th>Title 1</th>
				<th>Title 2</th>
				<th>Title 3</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>Data</td>
				<td>Data again</td>
				<td>Data yet other</td>    
				<td>Data still</td>
			</tr>
		</tbody>
	</table>

Country	Current US$	1990 US$
United States	$18.5billion	$5.4bn
Russia	$4.6billion	$6.2bn
France	$4.4bn	$2.1bn
UK	$1.9bn	$985million
Germany	$900m	$1.1bn
Canada	$900m	$543m
China	$700m	$125m
Israel	$500m	$283m

See also here for some of the original code.

Here is the javascript file:

Re: ALivrOuvert

2011-12-27 23:26:52+0100

Salut…
Alors ton article est périmé…
le logo a changé.. il s’est inkscapé…
Y a plus de titi mais une super Nathalie
Par contre le lien vers la librairie est le bon
Tu aurais pu rajouter qu’on a refait le site web ensemble

JavaScript filter search in table

Johannes — 2010-02-25 21:22:43+0100

Hey Echarp,

this is a really cool tool.
But I have a problem to transfer it to a different page. Even if I save your page to my desktop with the .js-file (path is adjusted) it doesnt work. The example from “vonloesch” works, but I want the highlighting thing.

Can somebody be so kind a post or send me the naked .html-file and the .js-file? You would really do me a favor!

Thanks in advance and kind regards!
Johannes

Speeding it up?

Matthew — 2008-11-22 19:42:01+0100

I like this script, but am trying to use it on a large table (4 columns and about 165 rows), so it is slow. Do you have any suggestions for how to speed it up? When I add a submit button it does help, but still takes about 10-15 seconds to return the search results.

Re: echarp's blog

Bruce — 2008-11-13 09:00:46+0100

Been quiet here for awhile. I still like the Parlement with “voting” system to determine “hot topics”. Now to start a hot topic eh eh eh
This is beter than many other “systems” and may be time to use a bit more? Keep updating
Bruce

Re: JavaScript filtersearch in table

Nick — 2008-11-13 08:47:40+0100

This is an awesome script, nice and lightweight an does the job perfectly, thanks :)

ALivrOuvert

echarp — 2008-05-17 15:45:33+0200

La librairie à paris 11ème

(j’écris ça, c’est pour aussi améliorer les résultats dans les moteurs de recherche)

On vient de faire deux sites pour Mag, un pour le magasin, le deuxième pour elle et toutes les bêtises qu’elle veut dire et écrire:

J’en profite, il y a déjà quelque temps de cela, mag et titi ont gagné un prix: le prix lilas des libraires. C’est un prix national destiné à une auteur, mais cette année il a été étendu à d’autres professions du livre, et nos demoiselles ont été récompensées de leurs heures de travail, et nombreuses activités comme le café littéraire ou les ateliers.

C’est aussi un prix un peu huppé. On s’est ainsi retrouvé invités au restaurant de la closerie des lilas, que j’ai eu l’occasion de découvrir. Vraiment sympathique!

(si vous répondez à ce mail, ce que vous écrirez sera reproduit sur le http://blog.echarp.org)

Re: Idiot

Bruce Eggum — 2007-12-05 19:22:18+0100

which politician you talking about now?

On Dec 5, 2007 12:22 PM, echarp <emmanuel.charpentier@free.fr> wrote:

Re: Idiot+1Parlement <http://leparlement.org>

— Bruce Eggum
Gresham Wisconsin, USA
http://www.doinggovernment.com/
Check out my Blog too
http://bruceeggum.blogster.com/

vote

Re: Idiot

Mirek — 2007-12-05 03:00:39+0100

So do I (beginning to love that word).

Although they are periods in the lifetime of every individual when one could be excused for not taking part in public affairs very actively (because of family, work, …)

Re: How to trust votes on internet

eggy — 2007-03-04 09:42:16+0100

Hi echarp (sharp you are)(compliment)
I set the RSS and it goes to http://echarp.org/Re_echarps_blog I thought it would go to blog, but has window of choice, none to the blog. I can get to parliament.

Be nice if RSS went here http://echarp.org/blog
another RSS to parliament proper?

I can not figure out how to email you direct?
I don’t know language and not tell today did I learn you are French? Co you live in France?

Perhaps a place for brief profile?
E Programs changing so fast hard to keep up.
Good that is happening!
EU Constitution very important!
NEED to divide powers, each country sovereign, EU only has limited power which is jointly accepted by each country. Now, the whole EU ruled by a commerce committee ~~- but better than being ruled by a shrub or a bush. Well, that is another subject -~~-long
Bruce