Xtykutl

I want to get this code working with my parser.

function search() {

var input, filter, table, tr, td, i;

input = document.getElementById("input");

filter = input.value.toUpperCase();

table = document.getElementById("myTable");

tr = table.getElementsByTagName("tr");

for (i = 0; i < tr.length; i++) {

    td = tr[i].getElementsByTagName("td")[0];

    if (td) {

        if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {

            tr[i].style.display = "";

        } else {

            tr[i].style.display = "none";

        }

    }

}

parser:

function load() {

data = data[0];

var uno = document.getElementById('data');

for(var i = 0; i < data.list.length; i++)

{

    var content = uno.innerHTML;

    content += "<div class='grid-item'><div class='inside' id='item" + i + "'><h2 id='contents" + i + "' class='pl-content-title' href=./index.html#" + data.list[i].hash + ">" + data.list[i].title + "</h2><div class='collapsing'><br><table id='mytable'>";

    for(var e = 0; e < data.list[i].content.length; e++)

    {

        content += "<tr><td class='tabledata'><a class='pl-content' href=./index.html#" + data.list[i].content[e].hash + ">" + data.list[i].content[e].title + "</a></td></tr>";

    }

    uno.innerHTML = content + "</table></div></div></div>";

}

html:

<input class="pl-search" type="text" placeholder="Suche" id="input" onkeyup="search()">

If I copy the table directly into my html it works but it doesnt if the table is built by my parser script.
The error message from the browser console is:

Uncaught TypeError: Cannot read property 'getElementsByTagName' of null

Any ideas on this?

<table id='mytable'>

should be

<table id='myTable'>

This typo caused table = document.getElementById("myTable"); to return null.

In a static example like this, you just fix the typo.

When coding a dynamic function, prevent errors by using a fallback

tr = table ? table.getElementsByTagName("tr") : null;

and so on with tr when you evaluate the for. (declare k)

for (i = 0, k= tr ? tr.length : 0; i < k; i++)