 
  
   
  
   
  
   
  
   
  
   
  
   
  
  if (data != "not found") {
        dropdown.style.display = 'block';
        dropdown.innerHTML = data;
        box.querySelectorAll('.dropdown li').forEach(item => {
            item.onclick = _ => input.value = item.innerText;
        });
      }  else {
       "files/jscode.js"
} 
  
  if (isset($_POST['s'])) {
  выборка из базы 
} esle {
 echo " not found"
}
if (data != "not found") {
        dropdown.style.display = 'block';
        dropdown.innerHTML = data;
        box.querySelectorAll('.dropdown li').forEach(item => {
            item.onclick = _ => input.value = item.innerText;
        });
      }  else {
       "Если правильно, то как загрузить файл для выполнения, что тут указать (синтаксис)?"
} 
  
   
  
  if(!res.body || res.body && !res.body.length) {
// "API JavaScript"
} 
  
   
  
  <form>
    <div class="s-box">
        <input type="text" id="input" autocomplete="off" class="s-input">
        <ul class="dropdown" id="dropdown"></ul>
        </div>
        <br><br><br><br><br><br><br>
    <div class="s-box">
        <input type="text" id="input" autocomplete="off" class="s-input">
        <input type="submit" class="s-btn" value="Найти">
        <ul class="dropdown" id="dropdown"></ul>
    </div>
</form><script>
function box_listener(box){
  const input = box.querySelector('.s-input');
  const dropdown = box.querySelector('.dropdown');
  if (input.value === '') dropdown.style.display = 'none';
  
  const fetch_data = _ => {
  	$.post("files/auto_complet.php", { s: input.value }, (data, status) => {
      if (data != "not found") {
        dropdown.style.display = 'block';
        dropdown.innerHTML = data;
        box.querySelectorAll('.dropdown li').forEach(item => {
          item.onclick = e => e.target.value = item.innerText;
        });
      }
  	});
  }
  
  input.oninput = fetch_data;
  input.onclick = fetch_data;
  
}
document.querySelectorAll('.s-box').forEach(box => {
  box_listener(box);
});
document.body.onclick = e => {
  document.querySelectorAll('.dropdown').forEach(el => el.style.display = 'none');
}
</script> 
  
   
  
  <form>
    <div class="s-box">
        <input type="text" id="input" autocomplete="off" class="s-input">
        <ul class="dropdown" id="dropdown"></ul>
    </div>
    <br><br><br><br><br><br><br>
    <div class="s-box">
        <input type="text" id="input" autocomplete="off" class="s-input">
        <ul class="dropdown" id="dropdown"></ul>
        <input type="submit" class="s-btn" value="Найти">
    </div>
</form><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
function box_listener(box){
  const input = box.querySelector('.s-input');
  const dropdown = box.querySelector('.dropdown');
  if (input.value === '') dropdown.style.display = 'none';
  
  const fetch_data = _ => {
  	$.post("files/auto_complet.php", { s: input.value }, (data, status) => {
      if (data != "not found") {
        dropdown.style.display = 'block';
        dropdown.innerHTML = data;
        box.querySelectorAll('.dropdown li').forEach(item => {
          item.onclick = () => e.target.value = item.innerText;
        });
      }
  	});
  }
  
  input.oninput = fetch_data;
  input.onclick = fetch_data;
  
}
document.querySelectorAll('.s-box').forEach(box => {
  box_listener(box);
});
document.body.onclick = e => {
  document.querySelectorAll('.dropdown').forEach(el => el.style.display = 'none');
}
</script> 
  
   
  
  <div class="s-box">
      			<input type="text" id="input" autocomplete="off" class="s-input">
                <input type="text" id="????" autocomplete="off" class="????">
      			<input type="submit" class="s-btn" value="Найти">
                <ul class="dropdown" id="dropdown"></ul>
</div>