Posting form data with .serialize() PHP error - php

Question

I'm posting form data that includes some checkboxes and other input to a PHP script with jQuery's .serialize().
post.js:
$(function(){
$("#button").click(function(){
$.ajax({
type: "POST",
url: "post.php",
data: $("form#input").serialize(),
success: function(data){
$.getJSON('post.php', function(data) {
$.each(data, function(key, val) {
})
})
}
})
})
})
post.php:
$tags = array();
foreach($_POST['checkboxes'] as $key => $value){
$tags[] = "$value";
}
$json = array(
array(
"tags" => $tags,
),
);
echo json_encode($json);
If I point the getJSON to post.php I get a PHP warning in my error log that says "PHP Warning: Invalid argument supplied for foreach()" and this causes the data from the input form to not be properly passed (i.e. a fwrite after the foreach doesn't write anything). If I reference another file for the getJSON, say data.php, or if I don't include it at all, the post works fine. Why is this happening? I could just store the data and make a second script to return the JSON data but it would be easier to do it all in one script.

Answer 1

Here's the deal:
success: function(data){
In the above piece, the data you are recieving is the returned json_encoded string containing key:value pairs of $tags, as you defined.
$.getJSON('post.php', function(data) {
Now, in your getJSON request you are passing over no values, and your foreach statement expects you to post the values of checkboxes so they can be parsed, and the tags be made. I'm not really sure I understand why you would want to do this, as the success: function(data) will natively parse the JSON being returned from the server and will be ready for you.
$.each(data, function(key, val) {
If you just simply lose the $.getJSON request, and use the each function, you will be iterating over the tags that you return from the server. I believe this is the intended functionality you want.

Answer 2

your code is breaking when checkboxes are not posted
$tags = array();
if( array_key_exists('checkboxes', $_POST) && is_array($_POST['checkboxes']) ) {
$tags = array_values($_POST['checkboxes']);
}
$json = array(
array(
"tags" => $tags,
),
);
echo json_encode($json);

Answer 3

You're getting Invalid argument supplied for foreach because it expects a value in $_POST['checkboxes'] which you're not sending in your $.getJSON call.
$.getJSON sends another AJAX call, a GET request to get a JSON file. You already sent a POST request to post.php, you don't need to send another call.
Add dataType: 'json' to your 1st call, and the JSON response will be parsed for you.
$.ajax({
type: "POST",
url: "post.php",
data: $("form#input").serialize(),
dataType: 'json',
success: function (data) {
$.each(data, function (key, val) {
// code here
});
}
});

Answer 4

you don't have to invoke "getJSON" because you already have what you want. Everything you need is in data. So your "success" callback should look something like this:
function(data){
var jsonData = $.parseJSON(data);
$.each(jsonData, function(key, val) {
})
}