trying to post json object from javascript to php

Question

I am trying to send form data in json format to php for process with sql but somehow it's not working, I am bit confuse with ajax and json thing, and very sure not doing right syntax, please help

function testObj(){      
        var obj = {"firstkey":"firstvalue","secondkey":"secondvalue"};
    $.ajax({ type: 'POST', url: 'testPht.php', data: {json: obj},
    dataType: 'json' });                      
}  

    <form id="theForm" enctype="multipart/form-data">                  
    <select id="itemsList" name="select_pro" onchange="testObj()" >
        <option>SELECT PRODUCT</option>
        <option value="21">KEY CHAIN</option>
        <option value="22">BISCUITS</option>
        </select>
        <input value="submit" type="submit"></form>

        <?php
        $json = json_decode($_POST['json']);
        var_dump($json);

Please use the "search" before ask: http://stackoverflow.com/a/8605464/1281258, once you get from php you can do whatever you want with this data, even save in sql database — josemwarrior, Oct 20 '15 at 10:37

score 2 · Answer 1 · edited Mar 03 '16 at 08:22

2

json_decode takes string as parameter. You just need to you can avoid use of json_decode and receive json data as php array from $_POST['json']

otherwise use stringify json data with JSON.stringify() function.

$.ajax({
  type: 'POST',
  url: 'test.php',
  data: {
    json: JSON.stringify(obj)
  },
  dataType: 'json'
});

edited Mar 03 '16 at 08:22

Pranav C Balan

113,687
23
165
188

answered Oct 20 '15 at 11:04

Srishin Kp

152
2
7

score 0 · Answer 2 · answered Oct 20 '15 at 10:38

0

Add contentType : 'application/json' to ajax method.

$.ajax({
    contentType : 'application/json',
    type : 'POST',
    ...

answered Oct 20 '15 at 10:38

whyguy

784
7
11

fico7489 · Accepted Answer · 2015-10-20T11:01:24.513

I created and tested example that works:

index.php

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
function testObj(){      
    var json = '{"firstkey":"firstvalue","secondkey":"secondvalue"}';
    $.ajax({ type: 'POST', url: 'ajax.php', data: {json: json}, success : function(data){
        alert(data);
    }});                      
}  
</script>


<form id="theForm" action="" type="post">                  
    <select id="itemsList" name="select_pro" onchange="testObj()" >
        <option>SELECT PRODUCT</option>
        <option value="21">KEY CHAIN</option>
        <option value="22">BISCUITS</option>
    </select>
    <input value="submit" type="submit">
</form>

ajax.php

$json = $_POST['json'];
$json = json_decode($json);
echo 'Received:';
var_dump($json);

or just:

$json = $_POST['json'];
var_dump($json);

You create two script index.php and ajax.php with this content and you will see when change select alerted data from ajax.

in alert it's printing the html tags and data of ajax.php – mohsin Oct 20 '15 at 10:51 — mohsin, Oct 20 '15 at 10:51
how can i avoid that and just get the text only? – mohsin Oct 20 '15 at 10:52 — mohsin, Oct 20 '15 at 10:52

score 0 · Answer 4 · answered Oct 20 '15 at 10:48

Try this, please include jquery first:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.js"></script>
<script>
$(document).ready(function()
{
        $(#submit).click(function()
        {
        var obj = {"firstkey":"firstvalue","secondkey":"secondvalue"};
        $("#itemsList option:selected").text();

        $.post("testPht.php",{obj:obj},function(data)
            {
            alert(data);
            });
        });
});
</script>

 <form id="theForm" enctype="multipart/form-data">                  
    <select id="itemsList" name="select_pro" onchange="testObj()" >
        <option>SELECT PRODUCT</option>
        <option value="21">KEY CHAIN</option>
        <option value="22">BISCUITS</option>
    </select>
    <input value="submit" id="submit" type="submit">
</form>

<?php
if($_POST)
{
$json = json_decode($_POST['obj']);
var_dump($json);
}
?>

trying to post json object from javascript to php

4 Answers4