数据表如何使用工具提示进行搜索?

I wrote a search function for a database with Javascript but it's searching with other values. It should search only with one line.

In my data code I take the values from SQL database then I put them into a table with while loop so I took all of data in it and added an info button so when clicked it will display more info.

My PHP code is:

<?php
$mysqli = new mysqli('xx','xx','xx','xx');
$sql_p = "SELECT usercode, gmailn ,yandexn , facebookn, hotmailn, mailn, protonn, yahoon, aoln, zohon, tutanotan, mailfencen ,hushmailn,time  FROM sell_p";     
$result = $mysqli->query($sql_p);
$num=0;
echo "<table id='myTable'>
        <tr>
            <th>Nickname</th>
            <th>Yandex</th>
            <th>Hotmail</th>
            <th>Facebook</th>
            <th>Proton</th>
            <th>Gmail</th>
            <th>Mailcom</th>
            <th><input type='text' id='myInput' onkeyup='myFunction()' placeholder='Search like k v' title='Type like nick admin'></th>
        </tr>";
while($row = mysqli_fetch_array($result)) {
    echo "<tr>";
    echo "<td>" . $row['usercode'] . "</td>";
    echo "<td>" . $row['yandexn'] . "</td>";
    echo "<td>" . $row['hotmailn'] . "</td>";
    echo "<td>" . $row['facebookn'] . "</td>";
    echo "<td>" . $row['protonn'] . "</td>";
    echo "<td>" . $row['gmailn'] . "</td>";
    echo "<td>" . $row['mailn'] . "</td>";
    echo "<td style='width:18%;'><button class='myButton2' onclick=\"if(document.getElementById('disp-yes".$num."').style.display=='table-row'){ document.getElementById('disp-yes".$num."').style.display='none';} else{ document.getElementById('disp-yes".$num."').style.display='table-row';}\">More info</button><button class='myButton2'>Make Offer</button></td>";
    echo "</tr>";
    echo '<tr style="display:none;font-weight: unset;" id="disp-yes'.$num.'">';
    echo "<td><b style='color:black;font-weight: unset;'>Tutanotan: </b>" . $row['tutanotan'] . "</td>";
    echo "<td><b style='color:black;font-weight: unset;'>Zoho: </b>" . $row['zohon'] . "</td>";
    echo "<td><b style='color:black;font-weight: unset;'>AOL: </b>" . $row['aoln'] . "</td>";
    echo "<td><b style='color:black;font-weight: unset;'>Mailfence: </b>" . $row['mailfencen'] . "</td>";
    echo "<td><b style='color:black;font-weight: unset;'>Yahoo: </b>" . $row['yahoon'] . "</td>";
    echo "<td><b style='color:black;font-weight: unset;'>Hushmail: </b>" . $row['hushmailn'] . "</td>";
    echo "</tr>";
    $num++;
}
echo "</table>";
mysqli_close($con);
?>

In my Javascript code I played with data for more searching options someone can search with typing "nick nickname","yandex value" etc. But my hiddenlayer is confusing everything in a table. I tried everything I knew but I couldn't make it so I searched a function with hiddenlayer but I need that because my data will be bigger than from now.

My Javascript code is:

<script>
function myFunction() {
var input, input2, input3, filter, table, tr, td, i, txtValue;
input = document.getElementById("myInput").value.toString();
input2 = input.slice(0,input.indexOf(' '));
input3 = input.slice(input.indexOf(' ')+1,input.length);
switch(input2){
    case 'nick':
        index=0;
        break
    case 'tunanotan':
        index=0;
        break
    case 'yandex':
        index=1;
        break
    case 'zoho':
        index=1;
        break
    case 'hotmail':
        index=2;
        break
    case 'aol':
        index=2;
        break
    case 'facebook':
        index=3;
        break
    case 'mailfence':
        index=3;
        break
    case 'proton':
        index=4;
        break
    case 'yahoo':
        index=4;
        break
    case 'gmail':
        index=5;
        break
    case 'hushmail':
        index=5;
        break
    case 'mail':
        index=6;
        break
}
filter = input3.toUpperCase();
table = document.getElementById("myTable");
tr = table.getElementsByTagName("tr");
for (i = 0; i < tr.length; i++) {
    td = tr[i].getElementsByTagName("td")[index];
    if (td) {
    txtValue = td.textContent || td.innerText;
    if (txtValue.toUpperCase().indexOf(filter) > -1) {
        console.log(txtValue);
        if (txtValue.indexOf('"0"')==-1 || txtValue.indexOf('0')==-1  ){
            tr[i].style.display = "";
        }
    } else {
        tr[i].style.display = "none";
    }
    }
}
}
</script>

Here some pictures from server