2015-06-06 8 views
11

Я новичок в PHP/jquery Я хотел бы спросить, как отправить данные json из поля формы, например (имя, возраст и т. Д.) С помощью ajax в формате json. К сожалению, я не могу найти никакой соответствующей информации об этом, это даже возможно сделать это динамически? Поисковые запросы Google дают ответы только наподобие создания данных вручную. как: name: X Y, age: 32, и так далее.Отправить данные формы с jquery ajax json

Есть ли все-таки сделать это?

Спасибо за помощь!

Edit:

<form action="test.php" method="post"> 
Name: <input type="text" name="name"><br> 
Age: <input type="text" name="email"><br> 
FavColor: <input type="text" name="favc"><br> 
<input type="submit"> 
</form> 
+0

Пожалуйста, покажите коды, над которыми вы уже работаете, чтобы мы могли помочь вам –

+0

Привет, Оли Сопрони Б.! Спасибо за ваш комментарий, мой вопрос редактируется с помощью кода формы. – user1888798

ответ

14

здесь просто один

вот мой test.php только для тестирования

<?php 

// this is just a test 
//send back to the ajax request the request 

echo json_encode($_POST); 

вот мой index.html

<!DOCTYPE html> 
<html> 

<head> 

</head> 
<body> 

<form id="form" action="" method="post"> 
Name: <input type="text" name="name"><br> 
Age: <input type="text" name="email"><br> 
FavColor: <input type="text" name="favc"><br> 
<input id="submit" type="button" name="submit" value="submit"> 
</form> 




<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<script> 
    $(document).ready(function(){ 
     // click on button submit 
     $("#submit").on('click', function(){ 
      // send ajax 
      $.ajax({ 
       url: 'test.php', // url where to submit the request 
       type : "POST", // type of action POST || GET 
       dataType : 'json', // data type 
       data : $("#form").serialize(), // post data || get data 
       success : function(result) { 
        // you can see the result from the console 
        // tab of the developer tools 
        console.log(result); 
       }, 
       error: function(xhr, resp, text) { 
        console.log(xhr, resp, text); 
       } 
      }) 
     }); 
    }); 

</script> 
</body> 
</html> 

Оба файла находятся место в том же каталоге

3

Вы можете использовать serialize() так:

$.ajax({ 
    cache: false, 
    url: 'test.php', 
    data: $('form').serialize(), 
    datatype: 'json', 
    success: function(data) { 

    } 
}); 
+0

Если вы используете '$ ('form'). Serialize()', то вы не делаете данные объектом; это должно быть просто 'data: $ ('form'). serialize(),'. –

1

Отправка данных из поля форм обратно на сервер (PHP) это делается обычно работают на жидком методом POST, который можно найти еще в суперглобальный массив $ _POST внутри PHP. Нет необходимости преобразовывать его в JSON, прежде чем отправлять его на сервер. Маленький пример:

<?php 

if($_SERVER['REQUEST_METHOD'] == 'POST') 
{ 
    echo '<pre>'; 
    print_r($_POST); 
} 
?> 
<form action="" method="post"> 
<input type="text" name="email" value="[email protected]" /> 
<button type="submit">Send!</button> 

С помощью AJAX вы можете делать то же самое, только без обновления страницы.

Смежные вопросы