jquery - Highlight the table cells based on textbox value -


i want highlight table cells having similar value textbox; i.e. user starts typing letters should highlight table cells....

<input type="text" id="txtsearch"/>   <html> <table id="table" style="height:350px;margin-left:1em;width:700px;">     <!--this table header-->     <tr style="display:table-row">         <th class="checkbox"><input type="checkbox"/></th>         <th class="name">name</th>         <th class="score">score</th>         <th class="email">email</th>         <th class="empty"></th>     </tr>     <tr>         <!--tabledata-->         <td ><input type="checkbox" /></td>         <td >vijay prakash</td>         <td >34</td>         <td >vijay@gmail.com</td>         <td ></td>     </tr> </table> <input type="button" id="btncalculate" value="calculate"/> <label>average:</label> <label id="lblaverage"></label> <label>max:</label> <label id="lblmax"></label> </form> </html>    </div>  

if want case insensitive contains approach try following:

    $("#text-box-id").keyup(function() {         var value = $(this).val().tolowercase();         // can add class ones want able          // highlight , use         $("td.highlightable").each(function(index, elem) {             var $elem = $(elem);             if (value.length > 0 && $elem.text().tolowercase().indexof(value) != -1) {                 $elem.css('backgroundcolor', 'yellow');                }             else {                 $elem.css('backgroundcolor', '');              }         });     }); 

http://jsfiddle.net/3leven11/s4tru/2/


Comments

Popular posts from this blog

linux - Does gcc have any options to add version info in ELF binary file? -

android - send complex objects as post php java -

charts - What graph/dashboard product is facebook using in Dashboard: PUE & WUE -