jQuery $.post() JSON Object

Question

I have a JSON Object

{ 
    "widgetSettings":[{"maxDisplay": 6, "maxPerRow": 2}],
    "widgets": [
        {"wigetID": 1, "show": false, "weight": 0, "widgetTitle": "Widget 1", "widgetColor": "defualt"},
        {"wigetID": 2, "show": false, "weight": 0, "widgetTitle": "Widget 2", "widgetColor": "defualt"},
        {"wigetID": 3, "show": false, "weight": 0, "widgetTitle": "Widget 3", "widgetColor": "defualt"},
        {"wigetID": 4, "show": false, "weight": 0, "widgetTitle": "Widget 4", "widgetColor": "defualt"},
        {"wigetID": 5, "show": false, "weight": 0, "widgetTitle": "Widget 5", "widgetColor": "defualt"},
        {"wigetID": 6, "show": false, "weight": 0, "widgetTitle": "Widget 6", "widgetColor": "defualt"},
        {"wigetID": 7, "show": false, "weight": 0, "widgetTitle": "Widget 7", "widgetColor": "defualt"},
        {"wigetID": 8, "show": false, "weight": 0, "widgetTitle": "Widget 8", "widgetColor": "defualt"},
        {"wigetID": 9, "show": false, "weight": 0, "widgetTitle": "Widget 9", "widgetColor": "defualt"},
        {"wigetID": 10, "show": false, "weight": 0, "widgetTitle": "Widget 10", "widgetColor": "defualt"},
        {"wigetID": 11, "show": false, "weight": 0, "widgetTitle": "Widget 11", "widgetColor": "defualt"},
        {"wigetID": 12, "show": false, "weight": 0, "widgetTitle": "Widget 12", "widgetColor": "defualt"},
        {"wigetID": 13, "show": false, "weight": 0, "widgetTitle": "Widget 13", "widgetColor": "defualt"},
        {"wigetID": 14, "show": false, "weight": 0, "widgetTitle": "Widget 14", "widgetColor": "defualt"},
        {"wigetID": 15, "show": false, "weight": 0, "widgetTitle": "Widget 15", "widgetColor": "defualt"},
        {"wigetID": 16, "show": false, "weight": 0, "widgetTitle": "Widget 16", "widgetColor": "defualt"} 
]}

I want to with jQuery to post that to a server side script so I can save it in a DB. And when I say save it I mean as the JSON object. However seeing as when you make a post/get other the way its posted is a JSON format my JSON that I am posting so I can save in the DB, gets lost it seems and the DB gets left with an empty value. Any ideas to what I may be doing wrong.. heres the jQuery portion.

$.post('ui-DashboardWidgetsPost.php', {"dashWidgets":dashboardJSON}, function(msg)
    {
        if(msg.error == "yes"){console.log('Error Found: '+ msg.errorMsg);}
        else
        {
        }
    });

EDIT The PHP

<?php
$validJSON = $_POST['dashWidgets'];

mysql_connect("127.0.0.1", "", "") or die('{"error": "yes", "errormsg": "'.mysql_error().'"}');
mysql_select_db("xxxx") or die('{"error": "yes", "errormsg": "'.mysql_error().'"}');

$result = mysql_query("UPDATE dashboardPrefs SET widgetSettings='".$validJSON."' WHERE userID=100") 
or die('{"error": "yes", "errormsg": "'.mysql_error().'"}');

echo '{"error": "none"}';
?>

Answer 1

If you want to send the JSON (as string, not the actual values) to the DB, perhaps you should treat it as one?

$.post('ui-DashboardWidgetsPost.php', {
    json: dashboardJSON
}, function(msg) {
    msg=jQuery.parseJSON(msg);
    if (msg.error == "yes") {
        console.log('Error Found: ' + msg.errorMsg);
    } else { ... }
});

Answer 2

Are you sure your server is parsing it properly? The fact that it gets that far implies that the issue is in your PHP.

You're also best off also making sure that the data is moving across the wire properly, which you can do through the network tab of Chrome/Firebug. That being said, I prefer to use an external packet sniffer like Fiddler (or HTTPScoop on the Mac).

Answer 3

You could do something like this:

1. Use the Javascript Object Method JSON.parse
2. Set That to a Certain POST value, we'll say "json"
3. Read it and decode on the server. With PHP, this would something like json_decode($_POST['json']).

Thus, the code on the client might be:

$.post('ui-DashboardWidgetsPost.php', 'json=' + JSON.parse(dashboardJSON), function(msg)
    {
        if(msg.error == "yes"){console.log('Error Found: '+ msg.errorMsg);}
        else
        {
        }
    });

And in PHP:

$jsonDecoded = json_decode($_POST['json'])

Answer 4

Use json as the forth parameter.

$.post('ui-DashboardWidgetsPost.php', dashboardJSON, function(msg)
    {
        if(msg.error == "yes"){console.log('Error Found: '+ msg.errorMsg);}
        else
        {
        }
    }, 'json');