php - search on table,real time -
i have below table:
<input type="search" class="light-table-filter" id="search" data- table="order-table" placeholder="kerko"> <table border="0" class=" table table-striped table-hover table-bordered table-condensed tabledemo bordered order-table table" > <tr id="header"> <th>id</th> <th>emri</th> <th>mbiemri</th> <th>username</th> <th>password</th> <th>email</th> <th>nr tel</th> <th>action</th> </tr> <?php if(count($records)){ $i = 1; $eachrecord= 0; foreach($records $key=>$eachrecord){ ?> <tr id="<?=$eachrecord['id'];?>"> <td><?=$eachrecord['id'];?></td> <td class="emri"><?=$eachrecord['emri'];?></td> <td class="mbiemri"><?=$eachrecord['mbiemri'];?></td> <td class="username"><?=$eachrecord['username'];?></td> <td class="password"><?=$eachrecord['password'];?></td> <td class="email"><?=$eachrecord['email'];?></td> <td class="nrtel"><?=$eachrecord['nrtel'];?></td> <td> <a href="javascript:;" id="<?=$eachrecord['id'];?>" class="ajaxedit"><img src="" class="eimage"> <span class="glyphicon glyphicon-pencil"></span></a> <a href="javascript:;" id="<?=$eachrecord['id'];?>" class="ajaxdelete"><img src="" class="dimage"> <span class="glyphicon glyphicon-trash"></span></a> </td> </tr> <?php } } ?> </table>
also,i want make real time search , have below jquery code:
<script type="text/javascript"> (function(document) { 'use strict'; var lighttablefilter = (function(arr) { var _input; function _oninputevent(e) { _input = e.target; var tables = document.getelementsbyclassname(_input.getattribute('data-table')); arr.foreach.call(tables, function(table) { arr.foreach.call(table.tbodies, function(tbody) { arr.foreach.call(tbody.rows, _filter); }); }); } function _filter(row) { var text = row.textcontent.tolowercase(), val = _input.value.tolowercase(); row.style.display = text.indexof(val) === -1 ? 'none' : 'table-row'; } return { init: function() { var inputs = document.getelementsbyclassname('light-table-filter'); arr.foreach.call(inputs, function(input) { input.oninput = _oninputevent; }); } }; })(array.prototype); document.addeventlistener('readystatechange', function() { if (document.readystate === 'complete') { lighttablefilter.init(); } }); })(document);
everything works perfectly.but want search rows except header of table has id #header.i can't change jquery code.also have tried different jquery above jquery code works perfect me. issue code when write something,it find row header hidded.
Comments
Post a Comment