Puedo filtrar datos, ahora estoy tratando de ocultar un div si el texto buscado no existe. Hay alguna forma de hacerlo.
<input type="text" placeholder="Search" class=".bar-input"> <div class="xyz"> hide me if searched value doesn't match</div> <ul class=".myUL"> <li>one</li> <li>two</li> <li>three</li> <li>four</li> <li>five</li> <li>six</li> </ul> $('.bar-input').on('keyup', function() { var input_val = $('.bar-input').val(); var tags = $('.myUL > li'); var count = tags.length; for (i = 0; i < count; i++) { if (!input_val || tags[i].textContent.toLowerCase().indexOf(input_val) > -1) { tags[i].style['display'] = 'block'; } else { tags[i].style['display'] = 'none'; } } });
Toma, acepta si esto te funciona.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input type="text" placeholder="Search" class="bar-input"> <div class="xyz"> hide me if searched value doesn't match</div> <ul class="myUL"> <li>one</li> <li>two</li> <li>three</li> <li>four</li> <li>five</li> <li>six</li> </ul> <script> $('.bar-input').on('keyup', function() { var input_val = $('.bar-input').val(); var tags = $('.myUL > li'); var count = tags.length; var match_cnt = 0; for (i = 0; i < count; i++) { if (!input_val || tags[i].textContent.toLowerCase().indexOf(input_val) > -1) { tags[i].style['display'] = 'block'; match_cnt++; } else { tags[i].style['display'] = 'none'; } } if(match_cnt<1) { $('.xyz').hide(); } else { $('.xyz').show(); } }); </script>