Почему сообщения не отправляются, php

Question

Всем привет, делаю форум. Использую ajax для отправки сообщений без перезагрузки, и написал такой код: JS:

```
$(document).on('load', function() {
    $('#form-bt').click(function(){
        var comment = $("#comment").val();
        var username = $("#username").val();
        $.ajax({
            url: 'index.php',
            type: 'POST',
            dataType: 'json',
            data: {
                comment: comment,
                username: username,
            },
            success: function(data){
                alert("Наконец-то всё получилось!");
            },
            error: function(){
                console.log('ERROR');
            }
        })
    })
})
```

PHP:

```
 <?php
    include 'index.html';
    $connect = new PDO ("mysql:host=localhost; dbname=forum;charset=UTF8", 'root', 'root');
    if (isset($_POST['username'])){
        $username = $_POST['username'];
        $comment = $_POST['comment'];
        $date = date('H:i:s');
        $query = $connect->query("INSERT INTO forum.comments (username, comment, data) VALUES ('$username', '$comment', '$date')");
    }

    $comments = $connect->query("SELECT * FROM forum.comments ORDER BY data DESC");
    $comments = $comments->fetchAll(PDO::FETCH_ASSOC);
    if ($comments){
        foreach($comments as $comment){

            echo "{$comment['data']} . {$comment['username']}";
            echo "<br>";
            echo "{$comment['comment']}";
            echo "<br>";

        }
    }else{
        echo "Пока нет ни одного комментария :(";
    }
?>
```

HTML:

```
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
    <style>
        body{
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    box-sizing: border-box;
}
* {
    box-sizing: border-box;
}
input, textarea{
    position: relative;
    width: 100%;
    margin: 5px;
    bottom: 0px;
}
form{
    display: flex;
    flex-direction: column;
}
p{
    font-size: 1vw;
    color: #357a6a;
}
.block-comment, .block{
    margin: 2vw 2vw 2vw 2vw;
    font-weight: bold;
    overflow-y: scroll;
}
.block{
    max-height: 30vw;
}
hr{
    background-color: #414b0c;
    margin: 2vw 2vw 2vw 2vw;
    height: 1%;
}
.line{
    width: 100%;
    height: 0.2vw;
    margin-top: 0.5vw;
    background-color: #414b0c;
}
h2{
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; 
    margin: 2vw 2vw 2vw 2vw;
}
@font-face {
    font-family: "Vinnytsia City"; 
    src: url("https://fonts-online.ru/fonts/vinnytsia-city") format("truetype"); 
    font-style: normal; 
    font-weight: normal; 
    font-family: Vinnytsia City; /* Гарнитура шрифта */
    src: url(https://fonts-online.ru/fonts/vinnytsia-city); /* Путь к файлу со шрифтом */
} 
    </style>
</head>
<body>
    
<h2>Форум</h2>

<div class="block">
    <form action="" method="POST" id="form">
        <div class="block-comment">
            <input type="text" id="username" name="username" class="r" placeholder="Ваше имя" required>
            <textarea name="comment" id="comment" cols="10" rows="5" class="r" placeholder="Ваш комментарий" required></textarea>
            <input type="button" id="form-bt" value="отправить">
        </div>
    </form>
</div>
<script src="jquery-3.6.0.min.js"></script>
<script src="form.js"></script>
</body>
</html>
```

При этом, не используя submit. Пожалуйста, помогите.

БЛОГ НА HUSL

Почему сообщения не отправляются, php

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