0

Не судите строго, я только изучаю верстку... Мне нужно сделать отправку и загрузку сообщений на страницу через ajax(т.е. без перезагрузки страницы). Я пробовала несколько вариантов, уже сама себя запутала... На данный момент сообщения отправляются в БД через ajax, и вынимаются оттуда, но только на уровне php. Когда пытаюсь отправить массив json обратно на страницу ч-з ajax, он приходит пустой... Для начала, я сделала, чтоб сообщения через php отправлялись в форму html. Помогите эту форму из ajax.php вывести на страницу, которая находится в файле guest-book.php? Файлы локальные. Никакого сайта пока нет, только физические страницы. Код приложен.

Форма:

    
<div id="pole">
    <input class="name" id="name" type="text" name="name" required placeholder=" " />
    <br />
    <input class="email" id="email" type="text" name="email" placeholder=" " />
    <textarea class="message" id="message" type="text" name="message" required placeholder=" "></textarea>
    <br />
</div>

    <div id="pole">
      <input class="name" id="name" type="text" name="name" required placeholder=" " />
      <br />
      <input class="email" id="email" type="text" name="email" placeholder=" " />
      <textarea class="message" id="message" type="text" name="message" required placeholder=" "></textarea>
      <br />

Скрипт:

    <script type = "text/javascript">
      $(function()) {
        $(".submit").click(function() {

            var name = document.getElementById("name").value;
            var email = document.getElementById("mail").value;
            var message = document.getElementById("message").value;

            jQuery('.name').val('');
            jQuery('.email').val('');
            jQuery('.message').val('');

            $.ajax({
                url: "ajax.php",
                type: "post",
                data: {
                  name: name,
                  email: email,
                  message: message
                }, // Передаем данные для записи
                success: function(result) {
                  $('#otz-1').html(result);
                  //alert(555);

                  // console.log('ok');
                  //if (result){ 
                  // jQuery('.otz-1 div').remove();


                  //jQuery('.otz-1').html(result);

                  /*
    					
                        jQuery('.otz-1').append(function(){
    						var res = '';
    						
    						for(var i = 0; i < result.messages.name.length; i++){
    							res += '<div class=""><div id="name1"><h5>' 
    									+ result.messages.name[i] 
    									+ '</h5></div><div id="date" align="right"><h5>' 
    									+ result.messages.email[i] + '</h5></div><div id="line"></div><div id="text1"><p>' 
    									+ result.messages.message[i] + '</p></div></div>';
    						}
    						return res;
    					});
    					
    					*/

                  //console.log(result);
                } //else {
                // alert(result.message);
              }
              /*return false;
                }
            });
    	return false;*/
            });
        }); </script>

ajax.php:

<?php
    $name = $_POST["name"];
    $email = $_POST["email"];;
    $message = $_POST["message"];
    $date = $_POST["date"];
    $date = date("y.m.d");

    $host = 'localhost';
    $db_user = 'root';
    $db_pass = '';
    $db_name = 'form';

    $connect = mysql_connect($host, $db_user, $db_pass) or die("Ошибка: " . mysql_error());
    mysql_select_db($db_name) or die("Ошибка");
    mysql_set_charset('utf8');

    if (isset($message) && $message != '') { 
        $query = 'INSERT INTO messages (name, email, msg, date) VALUES ("' . $name . '", "' . $email . '", "' . $message . '", "' . $date . '")';
    mysql_query($query) or die("Ошибка:" . mysql_error());
    }
    echo '<br />';  
        $query = 'SELECT * FROM messages ORDER BY id DESC LIMIT 10';
        $result = mysql_query($query) or die("Ошибка: " . mysql_error());
    while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
        echo '<ol>';
        echo '<li>';
        echo '<div id="com">';
        echo '<div id="name1">';
            echo '<label><h5>' . $row["name"] . '</h5></label>';
        echo '</div>';
        echo '<div id="date" align="right">';
        list($y, $m, $d) = explode ("-", $row['date']);
        echo '<label><h5>' . $d.".".$m.".".$y . '</h5></label>';
        echo '</div>';
        echo '<div id="line">';
        echo '</div>';
        echo '<div id="text1">';
            echo '<label><p>' . $row["msg"] . '</p></label>';
        echo '</div>';
    echo '</li>';
    echo '</ol>';
    }
    mysql_free_result($result);
    mysql_close($connect);
?>
1
  • 1. Зачем Вы каждый тег выводите отдельной строкой, это не правильно. 2. Вы уверены что в переменной result возвращаются данные? Если да, то тогда в конце php кода поставьте exit, чтобы скрипт дальше не выводил html-страницу.
    – DaemonHK
    Commented 20 нояб. 2017 в 4:22

1 ответ 1

0

В форме я не увидел кнопки, но даже если она есть , уберите type=submit ибо так и так страница будет перезагружена, далее зачем вы комбинируете синтаксис js и синтаксис jQuery?????

var name = document.getElementById("name").value;
        var email = document.getElementById("mail").value;
        var message = document.getElementById("message").value;

        jQuery('.name').val('');
        jQuery('.email').val('');
        jQuery('.message').val('');

Вот эти строки можно просто вот так сделать:

  $('#name').val();
 $('#mail').val();

И.Т.Д.

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.