javascript - How to find text inside table with div parent -
i want find text inside div parent table, if write text inside search bar want show result , rest of divs hidde, have differents td want search in 4 cells (left rigth) last cell not important
this html:
<div class="caja-orden-curso" alt="3"> <div class="contenido-curso"> <table id="perrito" border="1" style="width:98%"> <tr> <td width="220" height="100"> <div id="vehicle_type" class="top-order"> 36624 </div> </td> <td width="200"> <div id="step_form_1" class="order-steps"> <span id="created">02/02/2016 10:59</span> </div> </td> <td width="300"> <div class="order-details-top" style="height: 14px;">presidente masaryk, 29, , polanco</div> <div class="order-details-bottom" style="height: 23px;">colima, 323, , roma norte</div> </td> <td width="120"> <div class="order-details-top"> alexis <div> <div class="order-details-bottom"> saul </div> </td> <td width="120"> 565897423 </td> </tr> </table> </div> <div class="color-lateral-curso"> </div> <div class="tam-tabla-orden"> </div> </div> <div class="caja-orden-curso" id="statu-20" alt="12"> <div class="contenido-curso"> <table id="perrito" border="1" style="width:98%"> <tr> <td width="220" height="100"> <div id="vehicle_type" class="top-order"> 35684 </div> </td> <td width="200"> <div id="step_form_1" class="order-steps"> <span id="created">01/02/2016 10:59</span> </div> </td> <td width="300"> <div class="order-details-top" style="height: 14px;">yumnbvfd, 78984,</div> <div class="order-details-bottom" style="height: 23px;">jhgfre, 483</div> </td> <td width="120"> <div class="order-details-top"> rtynbv <div> <div class="order-details-bottom"> zsdf </div> </td> <td width="120"> 565897423 </td> </tr> </table> </div> <div class="color-lateral-finalizada-segundo" id="statu-9"> </div> <div class="tam-tabla-orden"> </div> </div>
and script:
$("#buscador").keyup(function() { var dinput = $(this).val(); if (!this.value) { $('div.caja-orden-curso').fadein(); } else { $("table#perrito").each(function() { $(this).find('div.top-order:contains(' + dinput + ')').length > 0 ? $(this).show() : $(this).parents('div.caja-orden-curso').fadeout(); }); } });
my example work first cell other 3 cells cant.
this fiddle
ids in page must unique. change id="perrito"
class="perrito"
, following.
$("table.perrito").each(function() { if ($(this).find('div:contains(' + dinput + ')').length) $(this).parents('div.caja-orden-curso').fadein(); else $(this).parents('div.caja-orden-curso').fadeout(); });
Comments
Post a Comment