Как записать сформированный текст в БД?

Question

Есть код js отвечающий за вывод ряда, места и цены за билет.

document.addEventListener('DOMContentLoaded', function() {        
  let places = document.querySelector('#places'),
      output = document.querySelector('#output'),
            btn = document.querySelector('#buy-btn'),
            _price = 0;
    
    btn.style.visibility = 'hidden';

  places.addEventListener('click', function(e) {
    let target = e.target;
    if(target.tagName.toLowerCase() === 'use') {
      target.classList.toggle('selected');
      
      let selected = places.querySelectorAll('.selected');
      if(selected.length > 0) {
                btn.style.visibility = 'visible';
        output.innerHTML = '';
                _price = 0;
        selected.forEach(function(e) {
          let row = e.getAttribute('data-row'),
              place = e.getAttribute('data-place'),
              price = e.getAttribute('data-price');
                    
                    _price += Number(price);
                    
                    btn.querySelector('span').innerText = _price;
          output.innerHTML += `Row: ${row}, Place: ${place}, Price: ${price}₴<br>`;
        });
      } else {
                btn.style.visibility = 'hidden';
                output.innerText = 'Please choose a place';
            }
    }
  });
})

Код js отвечающий за вывод времени сеанса.

document.getElementById("myselect").addEventListener("change", function(){
    document.getElementById('timee').innerHTML = "Selected time for today: "+this.value;   
});

document.getElementById("myselect1").addEventListener("change", function(){
    document.getElementById('timee').innerHTML = "Selected time for tomorrow: "+this.value;   
});

И сам код отвечающий за вывод текста на странице и кнопка с подсчетом цены.

<div class="mydiv1" id="timee"></div>
   <div id="output"></div>
    <p>
        <center><a id="buy-btn" class="glow-button" href="http://">Buy tickets here ❯<span>0</span></a><center>
    </p>

Теперь вопрос как мне этот выбранный и выведенный текст записать в бд, чтоб после нажатия на кнопку в таблице записались данные билета, времени и названия фильма выбранного клиентом?

Вот как все выглядит на странице сайта

Answer 1

Отдать данные на сервер (пусть в качестве языка программирования серверной части у нас выступит php). На сервере обработать данные и в нужном виде и в нужную таблицу нужной базы данных записать их.

Отправить данные на сервер можно с помощью объекта XMLHttpRequest примерно вот так:

let dataObject = { //это данные, которые необходимо отправить на сервер
    ticket: {
        'row': 9,
        'place': 2,
        'price': 170,
    },
    time: "13:45",
    nameMovie: "название_фильма",
}
const url = "путь_до_обработчика"; //здесь указываем путь до обработчика, который получить данные в своё распоряжение
let xhr = new XMLHttpRequest();

xhr.open('POST', url, true); //отправляем асинхронно (true) данные методом POST обработчику по адресу url

xhr.setRequestHeader('Content-type', 'application/json; charset=UTF-8'); //устанавливаем для HTTP-запроса необходимы заголовки, чтобы он понимал, какие данные ему перемещать
xhr.addEventListener("readystatechange", () => {
    if (xhr.readyState === 4 && xhr.status === 200) { //если запрос прошёл успешно
        console.log(xhr.responseText); //покажем в консоли ответ от сервера (вы же можете выводить сообщение о том, что билет куплен)
    }
});
xhr.send('data=' + JSON.stringify(dataObject)); //собственно, отправляем данные на сервер, но прежде конвертируем объект в JSON-строку
}

На сервере (в том файле-обработчике) мы ожидаем в массиве $_POST данные, которые можем получить вот таким образом $data = json_decode($_POST['data']). Там мы с ними делаем примерно следующее (лучше использовать PDO, но по-быстрому):

$mysqli = new mysqli("<имя_хоста_бд>", "<имя_пользователя_бд>", "пароль_пользователя_бд", "бд");

$mysqli->query("INSERT INTO `tickets` (`row`, `place`, `price`, 'time', `nameMovie`) VALUES ('{$data->ticket->row}', '{$data->ticket->place}', '{$data->ticket->price}', '{$data->time}', '{$data->nameMovie}')");

P.S. Весь вышеописанные код не (!!!) тестировался, но теоретически должен работать и (или) навести на правильную мысль для последующих запросов в поисковик :)

БЛОГ НА HUSL

Как записать сформированный текст в БД?

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