W3.JS HTML Filters
Filter elements:
w3.filterHTML(selector)
Filter Lists
Search for a name in the input field.
- Alfreds Futterkiste
- Berglunds snabbköp
- Centro comercial Moctezuma
- Ernst Handel
- FISSA Fabrica Inter. Salchichas S.A.
- Galería del gastrónomo
- Island Trading
- Königlich Essen
- Laughing Bacchus Wine Cellars
- Magazzini Alimentari Riuniti
- North/South
- Paris spécialités
- Rattlesnake Canyon Grocery
- Simons bistro
- The Big Cheese
- Vaffeljernet
- Wolski Zajazd
Example
<input oninput="w3.filterHTML('#id01',
'li', this.value)">
<ul id="id01">
<li>Alfreds Futterkiste</li>
<li>Berglunds snabbkop</li>
...
Try It Yourself »
With CSS »
Filter Tables
Name | Country |
---|---|
Berglunds snabbköp | Sweden |
North/South | UK |
Alfreds Futterkiste | Germany |
Königlich Essen | Germany |
Magazzini Alimentari Riuniti | Italy |
Paris spécialités | France |
Island Trading | UK |
Laughing Bacchus Winecellars | Canada |
Example
<input oninput="w3.filterHTML('#id01', '.item', this.value)">
<table
id="id01">
<tr>
<th>Customer</th>
<th>City</th>
<th>Country</th>
</tr>
<tr class="item">
<td>Alfreds Futterkiste</td>
<td>Berlin</td>
<td>Germany</td>
</tr>
<tr class="item">
<td>Berglunds snabbkop</td>
<td>Lulea</td>
<td>Sweden</td>
</tr>
...
Try It Yourself »
With CSS »