如何让我的搜索栏工作

我正在为我的CMS网站完成一个搜索栏

我快到了——我认为我的php是主要问题，

我有搜索输入

<div class="search">
  <form method="post" action="search.php" class="search" id="search">
    <input id='searchBar' class='search' placeholder="Search for a product" type='text'/>                 
   </form>
</div>

然后我有一些java脚本可以在按键时支持，希望能过滤掉当前显示在屏幕上的项目，

 function setSearchListener(){
 var searchBar = document.getElementById('searchBar');
 searchBar.addEventListener('keyup', function(){
 searchBar.addEventListener('focus', runSearchBar(this.value));
 });
}
 function runSearchBar(str){
var oldTarget = document.getElementById('productscontainer');
if(str.length == 0){
console.log('hello');
oldTarget.style.display = 'block';
}
else{
oldTarget.style.display = 'none';
}
var newTarget = document.getElementById('searchTarget');
fetch(newTarget);
}


function fetch(target) {
var xhr, target;
// create a request object
xhr = new XMLHttpRequest();
changeListener = function () {
    if (xhr.readyState === 4 && xhr.status === 200) {
        target.innerHTML = xhr.responseText;
    } else {
        target.innerHTML = "<p>Something went wrong.</p>";
    }
};
xhr.open("GET", "sql/search.php", true);
xhr.onreadystatechange = changeListener;
xhr.send();
console.log(name);
console.log('finding');
};
window.addEventListener('load', setSearchListener());

javascript端似乎对我来说一切都很好，但我不确定如何设置php与数据库交互端：

这是我的搜索.php

<?php
include("../dbase/config_database.php");    
    $query = "SELECT * FROM products WHERE id LIKE '%".$s."%' OR name LIKE '%".$s."%' OR description LIKE '%".$s."%' ";
    $result = mysqli_query($mysqli, $query);
    $rows = mysqli_fetch_array($result);
    $response = array(
        'id' => $rows ['id'],
        'name' => $rows ['name'],
        'description' => $rows ['description'],
        'price' => $rows ['price'],
        'quantity' => $rows ['quantity']
    );
    echo json_encode($response);
    }
?>

我基本上有一个显示产品的页面，我希望当你使用每个按键上的搜索栏说"iphone"时，它只会在页面上显示iphone产品，除非删除搜索栏的按键，否则不会显示其他产品。