Send form data with jquery ajax json

Question

I m new in PHP jquery I would like to ask how to send json data from a form field like  name  age  etc  with ajax in a json format  Sadly I can t found any relevant information about this it s even possible to do it dynamically  Google searches only gives back answers like build up the data manually  like  name  X Y  age  32  and so on   Is there anyway to do that   Thanks for the help   Edit    lt form action  test php  method  post  gt  Name   lt input type  text  name  name  gt  lt br gt  Age   lt input type  text  name  email  gt  lt br gt  FavColor   lt input type  text  name  favc  gt  lt br gt   lt input type  submit  gt   lt  form gt

User · Answer

You can use serialize   like this     ajax     cache  false    url   test php     data     form   serialize      datatype   json     success  function data

User · Answer

The accepted answer here indeed makes a json from a form  but the json contents is really a string with url-encoded contents   To make a more realistic json POST  use some solution from Serialize form data to JSON to make formToJson function and add contentType   application json charset UTF-8  to the jQuery ajax call parameters     ajax       url   test php       type   POST       dataType   json       data  formToJson    form         contentType   application json charset UTF-8

User · Answer

Sending data from formfields back to the server  php  is usualy done by the POST method which can be found back in the superglobal array   POST inside PHP  There is no need to transform it to JSON before you send it to the server  Little example    lt  php  if   SERVER  REQUEST METHOD       POST         echo   lt pre gt        print r   POST       gt   lt form action    method  post  gt   lt input type  text  name  email  value  joe gmail com    gt   lt button type  submit  gt Send  lt  button gt    With AJAX you are able to do exactly the same thing  only without page refresh

User · Answer

here is a simple one  here is my test php for testing only   lt  php     this is just a test   send back to the ajax request the request  echo json encode   POST     here is my index html   lt  DOCTYPE html gt   lt html gt    lt head gt    lt  head gt   lt body gt    lt form id  form  action    method  post  gt  Name   lt input type  text  name  name  gt  lt br gt  Age   lt input type  text  name  email  gt  lt br gt  FavColor   lt input type  text  name  favc  gt  lt br gt   lt input id  submit  type  button  name  submit  value  submit  gt   lt  form gt       lt script src  https   ajax googleapis com ajax libs jquery 2 1 3 jquery min js  gt  lt  script gt   lt script gt        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                                                          lt  script gt   lt  body gt   lt  html gt    Both file are place in the same directory

[javascript] Send form data with jquery ajax json

Examples related to javascript

Examples related to php

Examples related to jquery

Examples related to ajax

Examples related to json