Как вывести требуемые данные из БД MySQL (phpmyadmin)?

 const mysql = require("mysql2");
  
  const connection = mysql.createConnection({
    host: "31.31.198.105",
    user: "u0998746_default",
    database: "u0998746_default",
    password: "Alliance2013"
  });
   connection.connect(function(err){
      if (err) {
        return console.error("Ошибка: " + err.message);
      }
      else{
        console.log("Подключение к серверу MySQL успешно установлено");
      }
   });
   connection.query("SELECT * FROM users",
    function(err, results, fields) {
      console.log(err);
      console.log(results); // собственно данные
      console.log(fields); // мета-данные полей 
  });
  connection.end();

Всем привет! Такой вопрос как можно вывести требуемые данные из БД. Есть список чекбоксов, в котором пользователь выбирает необходимые ему, выбранные чекбоксы отображаются в соседнем окне, и нужно на основе полей выбранных чекбоксов вытащить информацию из БД, по подходящим компаниям под эти требования

let checkBoxes = document.getElementsByTagName("input");
let aviableList = document.getElementById("aviable");
let selectedList = document.getElementById("selected");

 [...checkBoxes].forEach(item=>item.addEventListener("click", function(){
  if (!this.checked) {
    aviableList.appendChild(this.parentElement);
  } else {
    selectedList.appendChild(this.parentElement);
  }  
}));
.container {
  display: flex;
  justify-content: center;
}
.Prokrutka,
.Prokrutka_out {
  flex: 0 1 auto;
}
.Prokrutka {
  margin-left: 15px;
  max-width: 35%;
  height: 400px;
  /* высота  блока */
  width: 400px;
  /* ширина  блока */
  background: #fff;
  /* цвет фона, белый */
  border: 1px solid #C1C1C1;
  /* размер и цвет границы блока */
  overflow-x: scroll;
  /* прокрутка по горизонтали */
  overflow-y: scroll;
  /* прокрутка по вертикали */
  padding-left: 15px;
  box-shadow: 0 0 5px rgba(0,0,0,0.5);
}

.Prokrutka_out {
  margin-left: 15px;
  max-width: 20%;
  height: 400px;
  /* высота  блока */
  width: 35%;
  /* ширина  блока */
  background: #fff;
  /* цвет фона, белый */
  border: 1px solid #C1C1C1;
  /* размер и цвет границы блока */
  overflow-x: scroll;
  /* прокрутка по горизонтали */
  overflow-y: scroll;
  /* прокрутка по вертикали */
  padding-left: 15px;
  box-shadow: 0 0 5px rgba(0,0,0,0.5);
  
}

@media screen and (max-width: 800px) {
  .container {
    flex-flow: column nowrap;
  }
  .Prokrutka,
  .Prokrutka_out {
    align-self: center;
    max-width: 100%;
    width: 85%;
    height: auto;
    padding: 10px;
   
  }
}


#CompleteButtonOption {
  position: relative;
left: 50%;
transform: translate(-50%, 0);
  cursor: pointer;
   margin-top: 10px; 
  background-color: rgb(39, 175, 12);
  max-width: 80%;
  width: 500px;
}
.leadOut {
  text-align: center;
  padding-top: 20px;
  height: 300px;
  width: 610px;
  border: 2px solid #C1C1C1;
  margin: auto;
  margin-top: 20px;
}
 <div class="all">
<p id="choose">Выберите необходимые услуги для перевозки</p>
<br>
<div class="container">
<div class="Prokrutka">
<div id="aviable">
  <br>
  <div id="checkGroup1"><label class="box-label"><input type="checkbox" id="op1" onchange="Options()" data-num="Сборный груз"> Сборный груз</label></div>

<!-- begin snippet: js hide: false console: true babel: false -->

  <div id="checkGroup16"><label class="box-label"><input type="checkbox" id="op16" onchange="Options()" data-num="Железнодорожные перевозки"> Железнодорожные перевозки</label></div>
  <div id="checkGroup17"><label class="box-label"><input type="checkbox" id="op17" onchange="Options()" data-num="Автоперевозки по России"> Автоперевозки по России</label></div>
  <div id="checkGroup18"><label class="box-label"><input type="checkbox" id="op18" onchange="Options()" data-num="Таможенное оформление"> Таможенное оформление</label></div>
  <div id="checkGroup19"><label class="box-label"><input type="checkbox" id="op13" onchange="Options()" data-num="Морские перевозки"> Морские перевозки</label></div>
  <div id="checkGroup20"><label class="box-label"><input type="checkbox" id="op14" onchange="Options()" data-num="Рефрижераторные перевозки"> Рефрижераторные перевозки</label></div>
  <div id="checkGroup21"><label class="box-label"><input type="checkbox" id="op15" onchange="Options()" data-num="Экспедирование"> Экспедирование</label></div>
  <div id="checkGroup22"><label class="box-label"><input type="checkbox" id="op16" onchange="Options()" data-num="Региональные перевозки"> Региональные перевозки</label></div>
  <div id="checkGroup23"><label class="box-label"><input type="checkbox" id="op17" onchange="Options()" data-num="Экспресс-доставка почтовыми вагонами"> Экспресс-доставка почтовыми вагонами</label></div>
  <div id="checkGroup24"><label class="box-label"><input type="checkbox" id="op18" onchange="Options()" data-num="От двери до двери"> От двери до двери</label></div>
</div>
</div>

<br>

<div class="Prokrutka_out">
 <div id="selected"> Вы выбрали:<br>
</div>
  </div>
</div>
<br>

<button id="CompleteButtonOption" onclick="Complete()">Подтвердить</button>

<div class="leadOut">
  <p>Подходящие компании</p>
</div>

Ответы (1 шт):

Автор решения: Andinevsky

Как я понял из вопроса, тебе стоит разобраться в ajax-запросах. https://snipp.ru/jquery/ajax-jquery#link-post-zaprosy - я пользовался этой страницей для практических примеров

На самой странице, куда обращаешься ajaxом делаешь запрос к БД и возвращаешь нужный результат.

P.s. для корректной работы функции должна быть подключена jQuery

→ Ссылка