Datatable показать скрытые элементы при успешном поиске - PullRequest
Новая
       8

Datatable показать скрытые элементы при успешном поиске

0 голосов
/ 08 января 2019

У меня есть некоторые элементы HTML, которые по умолчанию скрыты, пока пользователь не попытается их найти. Я думаю изменить класс элемента на show, когда поиск в DataTable будет завершен (если найден).

Обратитесь к приведенному ниже коду jQuery, где я реализую поиск, каков следующий шаг, чтобы показать родительский элемент или его контейнер?

например. если ключ поиска - c или cc или ccc, как показать его родительский (в данном случае <li class="show">)?

JQuery 

$("#txtSearch").on('keyup keypress blur change', function(e) { 
    var val = $(this).val();
    $('#mytable').DataTable().search(val).draw();
});

HTML 

<li class="hide">aaa</li>
<li class="hide">bbb</li>
<li class="hide">ccc</li>

1 Ответ

0 голосов
/ 09 января 2019

Взгляните на этот код Snipp, переберите классы Hide и извлеките внутренний текст, затем сравните результаты поиска. 

    $("#txtSearch").on('keyup keypress blur change', function(e) { 

        var val = $(this).val();
        var numItems = $('.hide').length ;

            for(var count = 1; count<=numItems;count++){

                var index = count-1;
                var searchResult = $(".hide:eq("+index+")").text(); 

                if(val.indexOf(searchResult) > -1){

                    $(".hide:eq("+index+")").removeClass("hide").addClass("show");
                }

                else{

                    $(".hide:eq(" + index + ")").removeClass("show").addClass("hide");
                }
            }

        $('#mytable').DataTable().search(val).draw();

    });
...