PHP AJAX JSON - Convert Input to JSON and Other PHP File Get The Value

Question

I noob and get mad when submit php form, convert input value to json, and other php file get it.

html

<form action="submit.php" method="post" name="form1" id="myform">
  <table width="100%" border="0" style="font-size: 65px;">
   <tr> 
    <td>Name</td>
    <td><input type="text" name="name" id="name"></td>
   </tr>
   <tr> 
   <tr> 
    <td></td>
    <td><button id="submit">Submit</button></td>
   </tr>
  </table>
 </form>
    <script src="script.js"></script>

script.js

    $('#myform').submit(function (event) {
  name = $('#name').val();
  var data = {
    name: name
  }
  $.ajax({
      type: "POST",
      url: 'submit.php',
      contentType: 'application/json',
      data: JSON.stringify(data),
      dataType: 'json'
    });
  return false
});

php file

header('Content-Type: application/json');
$name_dirty = json_decode($_POST['name']);
echo $name_dirty;

Can someone help me? submit.php got blank, I cant get the value that I submit from html page. Big Thanks

To help check your data, try changing `echo $name_dirty;` to `print_r($name_dirty);` this may help understand what is being passed to PHP. — Nigel Ren, Nov 29 '18 at 07:52
If you make a simple search on SO you can find a lot of question and answer like this — Sfili_81, Nov 29 '18 at 07:52
I have search on SO but rarely the solution using json stringify — dustin333, Nov 29 '18 at 07:54
Possible duplicate of [Receive JSON POST with PHP](https://stackoverflow.com/questions/18866571/receive-json-post-with-php) — Jeto, Nov 29 '18 at 08:02
Question is .. why are you sending JSON ?? (cf https://stackoverflow.com/questions/10955017/sending-json-to-php-using-ajax) — Jules R, Nov 29 '18 at 08:03
You don't need to use $_POST if you're passing a json string, use instead http://php.net/manual/en/wrappers.php.php#wrappers.php.input — alessandrob, Nov 29 '18 at 08:13

pr1nc3 · Answer 1 · 2018-11-29T08:34:26.110

Your Html

<table width="100%" border="0" style="font-size: 65px;">
        <tr> 
            <td>Name</td>
            <td><input type="text" name="name" id="name"></td>
        </tr>
        <tr> 
        <tr> 
            <td></td>
            <td><button id="submit">Submit</button></td>
        </tr>
    </table>
<script src="script.js"></script>

Your JS

  $('#submit').click(function() {
  name = $('#name').val()
  var data = {
    name: name
  }
  $.ajax({
      type: "POST",
      url: 'submit.php',
      data: data 
      dataType: 'json'
            complete: function (resultData) {
            alert('data has been send')
    })
})

In your php:

<?php

print_r($_POST['data'])

A few notes. Make sure you check your paths. In my answer i assumed that the problem is in the code and not in wrong paths. Also when you use form tag you can use a submit button like <input type="submit" value="Submit"> to submit your form without using Javascript. It would work in your case but it's just another way to tackle your issue.

In my answer i removed your form tags and triggered the action on button click. There will be no redirect to the page but you can set a redirect inside the js if it is important to you, on success function of the ajax that i added. At the moment i just throw an alert message when it works successfully.

PHP AJAX JSON - Convert Input to JSON and Other PHP File Get The Value

1 Answers1