0

Preciso filtrar elementos de uma lista e mostrar em uma lista resultado. Fiz o seguinte código:

var ele = [];

        $('.search').keyup(function(event) {

            var val = $(this).val().toUpperCase();

                $('.title').each(function(index, el) {
                    if($(this).find('a').text().toUpperCase().indexOf(val) != -1){
                        if(val != "" && val != null){
                                ele.push($(this).clone());
                        } 
                    }
                });

                $('.result').html(ele);
                ele = [];   
        });

Esse é o html:

<input  type="text" class="search">
<ul class="result"></ul>
<ul class="list">
<li class=""><a  href="">Elder</a>
    <ul>
        <li class=""><a href="">Cell</a>
            <ul>
                <li class="title"><a href="">Apolo</a></li>
                <li class="title"><a href="">megaman</a></li>
                <li class="title"><a href="">goku</a></li>
            </ul>
        </li>
    </ul>
</li>
<li>
    <ul>
        <li class="title"><a href=""> marcos</a></li>
        <li class="title"><a href=""> weslley</a></li>
    </ul>
</li>

O código funciona mas por algum motivo que não consegui identificar, ele lista o mesmo elemento que já foi filtrado enquanto se digita no input. Onde estou errando? Obrigado!

1 Resposta 1

2

Ele esta copiando o elemento para nova lista e depois recuperando ele mesmo, remove a classe depois de copiar:

    $('.search').keyup(function(event) {

        var val = $(this).val().toUpperCase();

        var ele = [];
        $('.title').each(function(index, el) {
            if($(this).find('a').text().toUpperCase().indexOf(val) != -1){
                if(val != "" && val != null){
                     var copy = $(this).clone();
                     copy.removeClass("title");
                     ele.push(copy);
                } 
            }
        });

            $('.result').html(ele);
    });
4
  • Obrigado pela resposta, mas tentei isso e não funcionou. Commented 1/04/2016 às 4:32
  • Entendi, ele está pegando o valor da lista resultado também. Vou editar. Commented 1/04/2016 às 4:36
  • Editei a resposta acima, teste agora. Commented 1/04/2016 às 4:42
  • Nossa funcionou perfeitamente, muito obrigado Rodrigo, não havia percebido a classe do elemento que também era copiada. Vlw, Abr. Commented 1/04/2016 às 4:46

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .