0

Я изучаю JS и не силён в PHP. Для того что бы отправлять данные в phpMyAdmin мне нужен PHP файл. Сейчас у меня в форме 1 input, но в дальнейшем их будит больше (email, login, name, phone) Я пытался самостоятельно написать год. Но он не работает, я не знаю почему и как это исправить. Буду благодарен если поможете.

<div class="overlay fade">
    <div class="popup">
        <div class="popup-close">&times;
        </div>
        <div class="popup-title">
            Форма обратной связи</div>
        <div class="popup-form">
            <form action="#" class="main-form">
               <div class="form_text">
                    <div class="popup-form-header">
                        Узнайте больше о своём отдыхе
                    </div>
         <label class="popup-form__label" for="phone">
                        Введите ваш номер телефона:
                    </label>
               </div>
                <div class="form_content">
                <input class="popup-form__input" name="phone" type="tel" required placeholder="Номер телефона">
                <button class="button popup-form__btn">
                    Оставить заявку!
                </button>
            </div>
            </form>
        </div>
    </div>
</div>

 const message = {
  loading: 'Загрузка',
  success: 'Спасибо! Мы с вами свяжемся!',
  failure: 'Произошла ошибка'
};

let Form = document.querySelector('.main-form'),
  Input = Form.getElementsByTagName('input'),
  statusMessage = document.createElement('div');
statusMessage.classList.add('status');

  // AJAXS

 function  sendForm(f) {
  f.addEventListener('submit', (event)=>{
 event.preventDefault();
    f.append(statusMessage);
   let dataForm  = new FormData(f);

    function postData (d) {
    return new Promise((resolve,reject)=>{
    let request = new XMLHttpRequest();
        request.open('POST','/connection.php');


    request.onreadystatechange = function(){
      if (request.readyState < 4) {
        resolve();
      } else if (request.readyState === 4){
        if (request.status == 200 && request.status < 300) {
          resolve();
        }else{reject()}
      }
    }; 
      request.send(d);
  });  
}
function clearInput(){
  for (let i = 0; i < Input.length; i++) {
    Input[i].value = '';
 }
} 
      postData(dataForm)
        .then(() => { statusMessage.textContent = message.loading; })
        .then(() => { statusMessage.textContent = message.success;})
        .catch(() => { statusMessage.textContent = message.failure; })
        .then(clearInput);
   });
}
sendForm(Form);  

<?php
header("Access-Control-Allow-Origin: *"); 
$phone = $_POST["phone"];



$host = 'localhost'; // адрес сервера 
$database = 'yoga_tours'; // имя базы данных
$user = 'root'; // имя пользователя
$password = ''; // пароль

// подключаемся к серверу
$link = mysqli_connect($host, $user, $password, $database) 
    or die("Ошибка " . mysqli_error($link));

$sql = "INSERT INTO phones (id, phone) VALUES (NULL, '$phone')";
$result = mysqli_query($link, $sql) or die("Ошибка" . mysqli_error($link)); 

if($result)
{
    echo "Выполнение запроса прошло";
    echo $_POST['phone'];
}

// закрываем подключение
mysqli_close($link);
?>

введите сюда описание изображения

  • Я очень сильно Настаиваю на том, чтобы вы смотрели на все ответы в теме про нахождения ошибок php.... ну и js если надо. – Алексей Шиманский Nov 08 '21 at 16:38
  • Если вы сильны в js, то пишите на Ноде весь код. Вам php не нужен – ArchDemon Nov 08 '21 at 16:38
  • 1) перепишите js-код на jQuery - сильно облегчите себе жизнь. 2) Поменяйте в connect.php метод POST на GET и вызовите connect.php?phone=333-222-333 - внутри connect.php сделайте var_dump($_GET) и посмотрте что Вам пришло. И делая дальше по коду var_dump( ... ); die(); просмотрите на каждом шаге что в какой переменной у Вас сидит. Это примитивнейший пример дебаггинга в php. 3) Как только все отладите верните все назад на POST, если не заработает - проверьте в браузере в инструментах разработчика на вкладке Сеть - уходит ли вообще запрос. –  Nov 08 '21 at 16:54
  • Я ещё не дошёл до jQuery. А с остальным попробую разобраться – Виталий Nov 08 '21 at 16:59
  • @phpBear не стоит раздавать людям вредные советы) jquery сейчас нужен как собаке пятая нога. даже bootstrap 5 сделан на чистом js. А для запросов сейчас хватает fetch. + async-await – Алексей Шиманский Nov 08 '21 at 17:08
  • @АлексейШиманский ну не скажите :) Для начальной разработки - обертка полейзнейшая - не нужно углубляться в дебри чистого js - экономит кучу времени. А по мере нарастания опыта - можно и на чистый перейти. И bs вообще не показатель кстати, я сам там не один перл в коде находил :) –  Nov 09 '21 at 02:30
  • @phpBear идеального кода не существует. Изъяны есть у всех топовых разработок без исключений ¯_(ツ)_/¯........ А писать сразу без jq стОит чтобы уже не привыкать к этому изначально. Ну да ладно. – Алексей Шиманский Nov 09 '21 at 05:42
  • @АлексейШиманский о противостояние jQuery и native JS сломано не мало копий и выпито не мало пива :) –  Nov 09 '21 at 08:33

0 Answers0