Javascript Search Exact Results Not Part Of
<p>I am trying to use the Javascript search from the below website however was wondering if there is a way to return only the exact term searched for, as if I type part of a word it returns the table row also.</p>

<p>ie. Seach for "Heath" returns the same result as searching Heathesh", is there a simple workaround?</p>

<p>Script:   <a href="http://heathesh.com/post/2010/05/06/Filtering-or-searching-an-HTML-table-using-JavaScript.aspx" rel="nofollow">http://heathesh.com/post/2010/05/06/Filtering-or-searching-an-HTML-table-using-JavaScript.aspx</a></p>

<p>Example:  <a href="http://heathesh.com/code/javascript/tablesearch/" rel="nofollow">http://heathesh.com/code/javascript/tablesearch/</a></p>

<hr>

<pre><code>&lt;table border="1" cellpadding="0" cellspacing="0"&gt;
    &lt;tr&gt;
        &lt;th&gt;ID&lt;/th&gt;
        &lt;th&gt;First Name&lt;/th&gt;
        &lt;th&gt;Surname&lt;/th&gt;
        &lt;th&gt;Website&lt;/th&gt;
    &lt;/tr&gt;
    &lt;tbody id="data"&gt;
        &lt;tr&gt;
            &lt;td&gt;1&lt;/td&gt;
            &lt;td&gt;Heathesh&lt;/td&gt;
            &lt;td&gt;Bhandari&lt;/td&gt;
            &lt;td&gt;&lt;a href="http://heathesh.com"&gt;http://heathesh.com&lt;/a&gt;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td&gt;2&lt;/td&gt;
            &lt;td&gt;Candice&lt;/td&gt;
            &lt;td&gt;David&lt;/td&gt;
            &lt;td&gt;&lt;a href="http://candicedavid.com"&gt;http://candicedavid.com&lt;/a&gt;&lt;/td&gt;
        &lt;/tr&gt;
    &lt;/tbody&gt;
&lt;/table&gt;

//define the table search object, which can implement both functions and properties
    window.tableSearch = {};

    //initialize the search, setup the current object
    tableSearch.init = function() {
        //define the properties I want on the tableSearch object
        this.Rows = document.getElementById('data').getElementsByTagName('TR');
        this.RowsLength = tableSearch.Rows.length;
        this.RowsText = [];

        //loop through the table and add the data to the table search object
        for (var i = 0; i &lt; tableSearch.RowsLength; i++) {
            this.RowsText[i] = (tableSearch.Rows[i].innerText) ? tableSearch.Rows[i].innerText.toUpperCase() : tableSearch.Rows[i].textContent.toUpperCase();
        }
    }
</code></pre>

<p></p>

<p>Next create the actual JavaScript function to run the search like so:</p>

<pre><code>    //onlys shows the relevant rows as determined by the search string
    tableSearch.runSearch = function() {
        //get the search term
        this.Term = document.getElementById('textBoxSearch').value.toUpperCase();

        //loop through the rows and hide rows that do not match the search query
        for (var i = 0, row; row = this.Rows[i], rowText = this.RowsText[i]; i++) {
            row.style.display = ((rowText.indexOf(this.Term) != -1) || this.Term === '') ? '' : 'none';
        }
    }

    //handles the enter key being pressed
    tableSearch.search = function(e) {
        //checks if the user pressed the enter key, and if they did then run the search
        var keycode;
        if (window.event) { keycode = window.event.keyCode; }
        else if (e) { keycode = e.which; }
        else { return false; }
        if (keycode == 13) {
            tableSearch.runSearch();
        }
        else { return false; }
    }

&lt;table border="0" cellpadding="0" cellspacing="0"&gt;
    &lt;tbody&gt;
        &lt;tr&gt;
            &lt;td&gt;
                &lt;input type="text" size="30" maxlength="1000" value="" id="textBoxSearch" onkeyup="tableSearch.search(event);" /&gt;
                &lt;input type="button" value="Search" onclick="tableSearch.runSearch();" /&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
    &lt;/tbody&gt;
&lt;/table&gt;
</code></pre>
