W3.JS Filters

Filter elements

Filter Lists

Search for a name in the input field.

  • {{CustomerName}}
  • w3.getHttpObject("customers.js", myFunction) function myFunction(x) { w3.displayObject("id01", x); }

    Example

    <input oninput="w3.filterHTML('#id01', 'li', this.value)">

    <ul id="id01">
      <li>Alfreds Futterkiste</li>
      <li>Berglunds snabbkop</li>
    ...

    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>
    ...