данные таблицы продолжают обновляться, даже если я применяю фильтр в JavaScript

Question

Я использую websocket, чтобы получить данные и связать их с HTML. Вот мой код:

 var sock = io('http://myip:8080',{transports: ['websocket']});
		
        sock.on('fetchdata', function(data) {
         var html = '';
         var i;
        

         for (i = 0; i < data.length; i++){
             html +='<tr class="usrRow usrRow0 ex'+data[i].name+' usrRow'+(i+1)+'" extn="'+data[i].name+data[i].username+'">'+
                                 '<td>'+data[i].name+'</td>'+
                                 '<td>'+data[i].username+'</td>';
                                 
                                               
       html+=   '</tr>';
         }


         $('#showdata').html(html);


         });

<table>
<tbody id="showdata">
                           
</tbody>
</table>

Вот код JavaScript моего поискового фильтра:

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

                var lastValue = $(this).val();
                console.log(lastValue)
                showHide(lastValue, $('#Activity').val());
            });


function showHide(lastValue, activity) {
                    $(".usrRow").show();

                    var v;
                    if (lastValue.length > 0) {
                        $(".usrRow").each(function() {
                            if ($(this).attr("extn").toLowerCase().indexOf(lastValue.toLowerCase()) >= 0) {
                                $(this).show();
                            } else {
                                $(this).hide();
                            }

                            if (activity != "All") {
                                if ($(this).find(".callstatus").html().toLowerCase().replace("&", "&") != activity.toLowerCase()) {
                                    $(this).hide();
                                }
                            }


                        });
                    }
}

Моя проблема в том, что у меня есть фильтр в html для фильтрации данных путем ввода имени или имени пользователя и т. Д. Фильтр работает отлично.

Но результат поиска отображается на секунду, и таблица обновляется, поэтому мой результат поиска исчезает, и отображается вся таблица.

Когда я останавливаю службу сокетов, данные остаются там, поскольку таблица не обновляется, поскольку данные из сокета не поступают.

Я хочу, чтобы результат поиска сохранялся до тех пор, пока в входных данных поиска есть текст. Что не так с тем подходом, который я использую? Как я могу исправить эту проблему?

Answer 1

Вы можете добавить условие, чтобы проверить, имеет ли поисковый ввод какое-либо значение, прежде чем изменять HTML

var sock = io('http://myip:8080',{transports: ['websocket']});

sock.on('fetchdata', function(data) {
    var html = '';
    var i;

    for (i = 0; i < data.length; i++){
        html +='<tr class="usrRow usrRow0 ex'+data[i].name+' usrRow'+(i+1)+'" extn="'+data[i].name+data[i].username+'">'+
                                 '<td>'+data[i].name+'</td>'+
                                 '<td>'+data[i].username+'</td>';


        html+=   '</tr>';
    }
    var searchText = $('#Activity').val();
    if(!searchText.length){
        $('#showdata').html(html);
    }


});