Created
January 31, 2017 21:06
-
-
Save jhonyjss/5bdb5605aab8b0f09d6389345a84de85 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="form-inline form-times"> | |
<p> BUSCA POR ASSUNTO </p> | |
<input type="text" class="form-control" id="input-times" placeholder="Digite o nome do time que deseja buscar"> | |
<button type="button" id="btn-times" class="btn btn-times"><i class="glyphicon glyphicon-search" aria-hidden="true"></i></button> | |
</div> | |
<div id="filter-results"></div> | |
<nav> | |
<ul> | |
<li>Corinthians</li> | |
<li>Palmeiras</li> | |
<li>São Paulo</li> | |
<li>Grêmio</li> | |
<li>Portuguesa</li> | |
</ul> | |
</nav> | |
<script> | |
$(document).ready(function () { | |
//Plugin de procura em tempo real | |
window.liveFilter({ | |
target:'#btn-times', | |
filters:'nav ul li', | |
fieldSearch:'#input-times', | |
evento:'click' //evento utilizado click, default: keyup | |
}) | |
</script> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
window.liveFilter = function(oArgs) { | |
var target = typeof oArgs.target !== 'undefined' ? oArgs.target : '', // campo ou botão | |
filters = typeof oArgs.filters !== 'undefined' ? oArgs.filters : '',// campos à ser filtrados, texto, box, colunas, tabelas. | |
parent = typeof oArgs.parent !== 'undefined' ? oArgs.parent : '', // Caso seja necessário utilizar elemento parent (jquery) | |
evento = typeof oArgs.evento !== 'undefined' ? oArgs.evento : 'keyup', // pode utilizar qual evento quiser | |
fieldSearch = typeof oArgs.fieldSearch !== 'undefined' ? oArgs.fieldSearch : ''; //Caso seja botão você deve informar este argumento no html | |
$(target).on(evento, function(event) { | |
// Recupera o texto do campo de entrada e redefine a contagem para zero | |
var filter = event.type == 'keyup' ? $(this).val() : $(fieldSearch).val() | |
count = 0; | |
// Faz o loop através do texto procurado dentro dos elementos | |
$(filters).each(function() { | |
// Se o item da lista não contiver alguma frase ou elemento então some | |
if ($(this).text().search(new RegExp(filter, "i")) < 0) { | |
$(this).parent(parent).fadeOut(); | |
var numberItems = count; | |
if (numberItems > 0) { | |
$("#filter-results").fadeIn().html('<br /><span class="alert alert-success">Resultado encontrado: ' + count + '</span>'); | |
} else { | |
$("#filter-results").fadeIn().html('<br /><span class="alert alert-danger">Nenhum resultado encontrado</span>'); | |
} | |
// senão mostra | |
} else { | |
$(this).parent(parent).fadeIn(); | |
count++; | |
if (filter.length == 0) { | |
$("#filter-results").fadeOut() | |
} | |
} | |
}); | |
}); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment