AJAX Запрос полезной нагрузки не отображается в журнале консоли - PullRequest
Новая
       1

AJAX Запрос полезной нагрузки не отображается в журнале консоли

0 голосов
/ 19 января 2020

Я изучаю AJAX и пытаюсь зарегистрировать все параметры данных в консоли в случае успеха и в случае сбоя при выдаче предупреждения. Мой код работает, и я могу успешно сбросить данные, которые я отправляю, но в консоли ничего не отображается, хотя я явно поместил console.log в Javascript, чтобы зарегистрировать это. это мой код Html page 

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>
  <h2>Send JSON</h2>
  <form action="postrequest.php" class="js-ajax-php-json" method="post" accept-charset="utf-8">
  <input type="text" name="param1"/>
  <input type="text" name="param2"/>
  <input type="text" name="param3"/>
  <button type="submit">Submit</button>
</form>


</body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
  $("document").ready(function(){
    $(".js-ajax-php-json").submit(function(){
     var param1 = $("#param1").val();
     var param2 = $("#param2").val();
     var param3 = $("#param3").val();
    $.ajax({
  url : 'postrequest.php',
  contentType: "application/json",
  dataType: "json",  
  type : 'POST',
  data: JSON.stringify({ 
    param1: param1,
    param2: param2,
    param3: param3
  }),
  success: function(data) {
            console.log(data);
        },
  error: function (data) {
    alert(data.param3);
  }       
       });
  });
});

</script>
</html>

postrequest. php

<?php 

var_dump( $_POST);

Что я делаю не так?

Ответы [ 2 ]

2 голосов
/ 20 января 2020

Ошибка 1: Удалить тег формы. Это будет работать, потому что содержит action = "postrequest. php". Вы делаете 2 вещи одновременно.

  1. Отправка формы через PHP с использованием тега формы.
  2. Вы выполняете ajax и отправляете форму.

Ошибка 2: Вы пишете var param1 = $("#param1").val(); Где вы определили param1, param2, param3?

Ошибка 3: Вы даете ссылку jquery, вы не закрыли тег сценария.

Ошибка 4: Вы отправляем data in ajax и снова выводим ответ ajax с той же переменной

Ошибка 5: Ajax Блок ошибок, который вы создали, неправильный. 

 <!DOCTYPE html>
    <html>
    <body>
      <input type="text" name="param1" id="param1"/>
      <input type="text" name="param2" id="param2"/>
      <input type="text" name="param3" id="param3"/>
      <input type="button" value='Submit' class="js-ajax-php-json" />

      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <script type="text/javascript">
         $(document).ready(function() {
            $(".js-ajax-php-json").click(function() {

                var param1 = $("#param1").val();
                var param2 = $("#param2").val();
                var param3 = $("#param3").val();
                $.ajax({
                    url: 'postrequest.php',
                    dataType: "html",
                    type: 'post',
                    data: {
                        param1: param1,
                        param2: param2,
                        param3: param3
                    },
                    success: function(rsp) {
                        console.log(rsp);
                    },
                    error: function(jqXHR, status, err) {
                        console.log("Error");
                    },
                });
            });
        });
      </script>
      </body>
    </html>

postrequest. php page 

<?php
  print_r($_POST);
?>

Я только что переписал ваш код с более простым кодом. Вы можете изменить его согласно вашему требованию.

0 голосов
/ 20 января 2020

Я думаю, что причина root в том, что страница перезагружается, когда вы нажимаете "Отправить". Следовательно, вы не можете видеть ничего в консоли. Попробуйте следующие шаги.

  1. Удалите атрибуты 'action' и 'method' из тега формы. Это уже обработано в запросе ajax.
  2. Add onsubmit = "return false;" приписать тег формы. Это предотвратит перезагрузку страницы.
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...