jquery json not returning value

Question

I am using jquery to submit a form using serialize and all is well except if I input more than 1 box. If I input 1 box, the msg.box appears in #BA_addbox. If however I enter more than 1 box using , as delimiter, then no msg is shown and no json tab appears in firebug. just the html which is correct. Where have I gone wrong with code.

I have created an array and using foreach with explode to seperate the values but no multiple value being returned. Thanks

UPDATE: vars are being collected in the php script like thus:

php code

$dept = mysql_real_escape_string($_POST['customerdept']);
$company = mysql_real_escape_string($_POST['BA_customer']);
$address = mysql_real_escape_string($_POST['customeraddress']);
$service = mysql_real_escape_string($_POST['BA_service']);
$box = mysql_real_escape_string($_POST['BA_box']);
$date = DateTime::createFromFormat('d/m/Y', $_POST['BA_destdate']);
$destdate = $date - > format('Y-m-d');
$authorised = mysql_real_escape_string($_POST['BA_authorised']);
$submit = mysql_real_escape_string($_POST['submit']);

$array = explode(",", $_POST['BA_box']);

     if (isset($_POST['submit']))   {
        foreach ($array as $box) {

        //$sql = "INSERT INTO `act` (service, activity, company, address, department, user, destroydate, date, item, new) VALUES ('$service', '$activity', '$company', '$address', '$dept', '$authorised', '$destdate', NOW(), '$box', 1)";
        //$result = runSQL($sql) or die(mysql_error());

        $form=array('dept'=>$dept,
                 'company'=>$company,
                 'address'=>$address,
                 'service'=>$service,
                 'box'=>$box,
                 'destroydate'=>$destdate,
                 'authorised'=>$authorised,
                 'submit'=>$submit);
        $result=json_encode($form);

        echo $result;


   } 
  }

jquery code

submitHandler: function()   {
                if ($("#BA_boxform").valid() === true)  { 
                var data = $("#BA_boxform").serialize();
                $.post('/domain/admin/requests/boxes/boxesadd.php', data, function(msg) {
                $("#BA_addbox").html("You have entered box(es): " + "<b>" + msg.box + "</b><br /> You may now close this window.");
                $("#BA_boxform").get(0).reset();
                }, 'json');

         } else

         { 
           return; 
         }
        },
        success:    function(msg)   {
                //$("#BA_addbox").html("You have entered a box");
                //$("#BA_boxform").get(0).reset();
        }   

Answer 1

Per @nnnnnn:

Your resulting json looks like the structure below if there is more than one box. This is invalid json, and therefore can not be reliably parsed.

{
  ...
}{
  ...
}

To fix this, you have to add the arrays to another array, then encode the parent array.

$box = mysql_real_escape_string($_POST['BA_box']);
$array = explode(",", $_POST['BA_box']);
$output = Array();

if (isset($_POST['submit']))   {
  foreach ($array as $box) {

    //$sql = "INSERT INTO `act` (service, activity, company, address, department, user, destroydate, date, item, new) VALUES ('$service', '$activity', '$company', '$address', '$dept', '$authorised', '$destdate', NOW(), '$box', 1)";
    //$result = runSQL($sql) or die(mysql_error());

    $form=array('dept'=>$dept,
                'company'=>$company,
                'address'=>$address,
                'service'=>$service,
                'box'=>$box,
                'destroydate'=>$destdate,
                'authorised'=>$authorised,
                'submit'=>$submit);

    //Add to a parent array instead
    $output[] = $form;

  }

  //encode the entire array
  $result = json_encode( $output );

  echo $result;
}

This will result in the following structure and for a variable data that contains the parsed json each box can be retrieved via data[0], data[1] etc.

[
  {
    ...
  },
  {
    ...
  }
]

Answer 2

First fix the php to return a valid json array.

if (isset($_POST['submit']))   {
  foreach ($array as $box) {

    //$sql = "INSERT INTO `act` (service, activity, company, address, department, user, destroydate, date, item, new) VALUES ('$service', '$activity', '$company', '$address', '$dept', '$authorised', '$destdate', NOW(), '$box', 1)";
    //$result = runSQL($sql) or die(mysql_error());

    $form=array('dept'=>$dept,
             'company'=>$company,
             'address'=>$address,
             'service'=>$service,
             'box'=>$box,
             'destroydate'=>$destdate,
             'authorised'=>$authorised,
             'submit'=>$submit);
    $result[]=$form;

  }
  echo json_encode( $result );
}

Then the msg parameter in the post callback should be an array of results, so you can't just do msg.box to get the list of boxes. I would suggest something like this:

boxes = jQuery.map(msg,function(item){
  return item.box;
}).join(',');

That extracts the box property from each item in the array and joins them into a comma separated list. You can then display that list like this:

$("#BA_addbox").html("You have entered box(es): " + "<b>" + boxes + 
  "</b><br /> You may now close this window.");

Given these changes, your code works for me. If you're having other problems, I suggest you post more of your html - in particular your form structure. It's possible your form isn't submitted the correct values to get a valid response from the server.