Ajax. Не могу вывести полученные данные из формы - JavaScript, Ajax

Andarilz · 15.12.2019, 17:32

Здравствуйте. Мучаюсь несколько дней с проблемой, но люди помогают, дело медленно движется)
Пробую еле-еле написать мини-чатик, человек с другого форума многое рассказал, спасибо ему. Ситуация такая: данные отсылаются, обрабатываются, добавляются в БД, вытаскиваются из БД, возвращаются, НО при попытке вывода их в консоль, не отображаются там (вернее, отображаются в консоли на 0.3 секунды сразу после клика по кнопке "отправить" и пропадают потом навсегда, до следующего клика), что с этим делать и как на страницу вставить "полученные" данные, я не знаю... Прошу помощи, спасибо.
п.с. ошибок в консоли нет, там вообще пустота.

Сама страница с формами

Код:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Чат</title>
    <style>
        .message{
            border:1px solid #ccc;
            padding:10px;
            margin-bottom:20px;
        }
 
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
</head>
<body>
<form method="post" id="ajaxForm">
    <p>
        <label for="name" style="margin-right:8px">Имя</label>
        <br>
        <input type="text" name="name" class="name">
    </p>
    <p>
        <label for="text">Текст</label>
        <br>
        <textarea name="text" cols="21" rows="5" class="text"></textarea>
        <br>
    </p>
    <input type="submit" class="click">
</form>
<hr>
<div class="message"></div>
<script src="script2.js"></script>
</body>
</html>

Серверная часть (в БД добавляется, поля id name text date)

Код:

<?php
 
//подключение к БД
function db_join(){
    static $db;
    if($db===null){
        $db = new PDO("mysql:host=localhost;dbname=ajax_jax","root","");
        $db->exec("SET USE UTF-8");
    }
    return $db;
}
 
//Вставка в БД
function db_query($name,$text){
    $bd = db_join();
    $sql = "INSERT INTO ajax(name,text) VALUES('$name','$text')";
    $query=$bd->prepare($sql);
    $query->execute();
}
 
if(count($_POST) > 0){
    if(!empty ($_POST["name"]) || !empty($_POST["text"])) {
        $name = $_POST["name"];
        $text = $_POST["text"];
        $db = db_query($name,$text);
    }
}
 
 
 
//Вывод из БД
function db_read(){
    $bd = db_join();
    $sql = "SELECT * from `ajax` ORDER BY `date` DESC";
    $query=$bd->prepare($sql);
    $query->execute();
    return $query->fetchAll(PDO::FETCH_ASSOC);
}
 
exit(json_encode(db_read()));
 
?>

JS-файл, который у меня и не хватает ума завершить...

Код:

function funcSuccess(data){
    $.each(data, function() {
        console.log(this.id, this.name, this.text, this.date) 
    })
 
}
 
$(function(){
    $("form").submit(function(event){
        $.ajax({
            url:"content.php",
            type: "POST",
            data:{name: $(".name").val(),text: $(".text").val()},
            dataType:"json",
            success: funcSuccess
        })
    })
})

ADSoft · 18.12.2019, 21:14

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

Код:

 $("form").submit(function(event){
    event.preventDefault();

18.12.2019, 21:14	#2
ADSoft Старожил Регистрация: 25.02.2007 Сообщений: 4,158	в консоли само собой ничего не исчезает, значит у вас страничка перезагружается, а делает это - потому как вы не отменили дефолтного поведения, делается это так Код: `$("form").submit(function(event){ event.preventDefault();` Сайты, приложения, автоматизация в широком смысле слова

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Не выводит полученные данные в C++	Dima4563	Помощь студентам	1	30.10.2018 21:05
Данные полученные от DLL (кто очищает)	xper13	Общие вопросы Delphi	7	11.02.2014 14:32
Вывести данные полученные от программы	Shouldercannon	PHP	4	24.10.2013 16:29
$.ajax как установить полученные cookies в браузер?	bagabuga	JavaScript, Ajax	2	31.07.2012 09:45
вывести в отчет обсолютно все данные с формы	serenu	Помощь студентам	0	10.04.2010 14:07