search

PicNet / tablefilter

This js project adds column filtering capabilities to a regular html <table> by adding a row to the <thead> section of a table and adding filters that allows real time filtering of tabular data.
http://web.archive.org/web/20150124160820/http://www.picnet.com.au/picnet-table-filter.html
27 stars 9 forks source link

Uncaught TypeError: Cannot call method 'appendChild' of undefined #38

Closed marceloverdijk closed 12 years ago

marceloverdijk commented 12 years ago

I tried the tableFilter for the first time but got: Uncaught TypeError: Cannot call method 'appendChild' of undefined

My code:

    <input id="test-filter" type="text" class="search-query" placeholder="Zoeken">
</p>
<table id="test-list" class="table table-striped">
    <tbody>
        <tr>
            <td>Marcel Overdijk</td>
        </tr>
    </tobdy>
</table>```

and

```$(document).ready ->
    $('#test-list').tableFilter({
        additionalFilterTriggers: [$('#test-filter')]
    })```

I'm using latest jQuery 1.7.1.

Any idea what I'm doing wrong here?
henla464 commented 12 years ago

Hi Marcel,

You need to add a table header row to your table, something like this:

Text Column 1
Marcel Overdijk
marceloverdijk commented 12 years ago

Thanks! That was better but now I get a: Uncaught TypeError: Cannot read property 'style' of undefined

BTW, per my design I can't add headers. Is there no option to use tableFilter without headers?

I'm looking to implement something similar to: http://jquerymobile.com/test/docs/lists/lists-search.html

henla464 commented 12 years ago

Hi Marcel!

Try the latest version, it creates the header row automatically if it is missing. See demosrc2.hml for an example. Since you probably don't want to show the header, just hide it with CSS.