JQuery: как остановить функцию AJAX, избегая строки JSON, используемой для данных POST

Мне нужно сериализовать все входы из формы в строку JSON.
С помощью этого сообщения я могу успешно создать допустимую строку, как показано ниже:

{"input01":"value01","input02":"value02","input03":"value03"}

Однако, когда я пытаюсь использовать строку для данных POST с помощью функции jQuery Ajax, кажется, что она добавляет обратную косую черту в строку, в результате чего строка JSON отправляется с использованием GET, а не POST. Загруженная страница PHP возвращает массив $_GET:

[{\"input01\":\"value01\",\"input02\":\"value02\",\"input03\":\"value03\"}] =>

Я тестировал строку JSON, используя alert(), чтобы подтвердить правильность структуры, прежде чем использовать ее в функции AJAX.
Кроме того, если я просто вручную ввешу правильную строку JSON, AJAX правильно разместит данные.

Мой код выглядит следующим образом:

var dataJSON = $.toJSON($('#form').serializeObject());
alert(dataJSON);

$.ajax({
    type: "POST",
    url: "ajax.php",
    data: 'Query01=01&Query02=02',
    dataType: 'json',
    success: function(data){
       if (data==1){
         $('#wrap').load('ajax.php',dataJSON);
       }
    }
});

Ответы

Ответ 1

После очистки Google и сайта jQuery я пришел к личным выводам о том, что функция $.load преобразует любую переменную, переданную ей как запрос (как моя первоначальная проблема выше). Если вы хотите передать через него строку JSON, ее нужно ввести вручную.

Чтобы обойти это, я использовал функцию низкого уровня $.ajax. Преимущество использования этого метода означало, что я мог бы также отправлять данные POST с помощью стандартной функции .serialize() вместо того, чтобы преобразовывать данные формы в JSON.

Мой последний код:

var formData = $('#form').serialize();

$.ajax({
     type: "POST",
     url: "ajax.php",
     data: 'Query01=01&Query02=02',
     dataType: 'json',
     success: function(data){
          if (data==1){
               $.ajax({
                    type: "POST",
                    url: "ajax.php",
                    data: formData,
                    success: function(html){
                         $("#wrap").replaceWith(html);
                    }   
               });
          }
     }
});

Если у кого-то еще есть решение, прокомментируйте.

Ответ 2

Это поведение по умолчанию $.ajax(). Вы можете изменить его, установив для параметра processData значение false. См. $.ajax() параметры.

data  Object, String

Данные для отправки на сервер. это преобразован в строку запроса, если не уже строка. Он прилагается к url для запросов GET. См. ProcessData возможность предотвратить автоматическое обработка. Объект должен быть ключ/значение пар. Если значением является массив, jQuery сериализует несколько значений с одинаковыми ключ, то есть {foo: [ "bar1", "bar2" ]} становится '& foo = bar1 & foo = bar2'.

и

processData   Boolean Default: true

По умолчанию данные передаются в данные вариант как объект (технически, ничего, кроме строки) будет обрабатывается и преобразуется в запрос строка, установка по умолчанию Тип содержимого "Применение/х-WWW-форм-urlencoded". Если вы хотите отправить DOMDocuments или другие не обработанные данные, установите это параметр false.

Ответ 3

Убедитесь, что вы

echo $_GET['varwithurl']

не

echo json_encode($_GET['varwithurl'])

как это делают многие веб-примеры php.

Я отправляю данные с url с $.ajax() и не вижу нежелательных обратных косых черт в PHP скрипт.

Ответ 4

Я сделал это так, чтобы он работал с stripslashes на стороне php.

Что-то вроде этого:

$data = json_decode(stripslashes($_POST['json_data']));

Ответ 5

<html>
<head>
<script src="resources/jquery-2.1.0.js"></script>
<script src="resources/jquery.serializejson.min.js"></script>
</head>
<body>
  <script>

        $(document).ready(function(){

            $("#simplepost").click(function(e){

                var MyForm = $("#appForm").serializeJSON();
                console.log(MyForm);

            $.ajax(
                    {
                        url: "rest/emp/create",
                        type: "POST",
                        data: JSON.stringify(MyForm),
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success:function(maindta){
                            alert(maindta);
                        },
                        error: function(jqXHR, testStatus, errorThrown){
                            alert(errorThrown);
                        }
                    });
            e.preventDefault(); //STOP default action
        });
    });
</script>
<h2>Hello World!</h2>
<form id="appForm" method="POST">
    EmployeeID:<input type="text" name='id' value="" />
    Employee Name:<input type="text" name="name" value=""/>
<br>
<input type="button" value="Submit" id="simplepost" />
</form>
</body>
</html>