CODEWITHSUNDEEP
phpjavascriptjqueryjson
Ali Nouman
Ali Nouman

Reputation: 3414

Sending multiple data in jquery

i have this code for sending data 

  var test={imagename:"apple.jpg",x:"13",y:"33"};

  $.ajax({
 type: "POST",
     url: "some.php",
     data: test,
     success: function(response){
    console.log(response);
    }
   });

but now i want to send multiple data to php.My php side code is like this

print $_POST['imagename'];

i think of an approach like this var test={imagename:"apple.jpg|hen.jpg",x:"13|44",y:"33|22"}; and on php getting $_POST['imagename'] then split it according to | but i am not liking semantic approach of it.
1-Does any one know better solution?
2-Please provide both javascript,jquery and php code for answer.
3-One final question is this notation called json var test={imagename:"apple.jpg",x:"13",y:"33"};
Thanks

Upvotes: 1

Views: 683

Answers (5)

pimvdb
pimvdb

Reputation: 154818

An array is the most meaningful solution here - something like this in JavaScript:

var data = [
    {imagename:"apple1.jpg", x:"13", y:"33"},
    {imagename:"apple2.jpg", x:"51", y:"84"},
    {imagename:"apple3.jpg", x:"79", y:"57"}
];

Send as:

$.ajax({
     type: "POST",
     url: "some.php",
     data: {data: data},
     success: function(response){
         console.log(response);
     }
 });

and in PHP you can get them like:

<?
    print_r($_POST['data']); // dumps an array

    $filename1 = $_POST['data'][0]['filename']; // filename of item #1
?>

Lastly, var test={imagename:"apple.jpg",x:"13",y:"33"}; is nothing more than some JavaScript code. It is not JSON. Although JSON looks like JavaScript (JS even stands for JavaScript in JSON), it is nothing more than the characters you're sending. JSON is a format for transferring data. As soon as you "unpack" it (either in JavaScript or PHP) then it's not called JSON anymore.

Upvotes: 7

trapp
trapp

Reputation: 86

Use arrays. Javascript:

var data = {
    "images": [
          {name: "apple.jpg", x: 13, y:14},
          {name: "egg.jpg", x:14, y: 35}
    ]
};

$.ajax({
   type: "POST",
   url: "some.php",
   data: data,
   success: function(response){
     console.log(response);
   }
 });

PHP:

// First.
print $_POST['images'][0]['name'] // Prints apple.jpg
// Second
print $_POST['images'][1]['name'] // Prints egg.jpg

// Looping
foreach($_POST['images'] as $image) {
    print $image['name'];
    print $image['x'];
    print $image['y'];
}

From your example

var test={imagename:"apple.jpg",x:"13",y:"33"};

The following part is considered as JSON (JavaScript Object Notation):

{imagename:"apple.jpg",x:"13",y:"33"}

Every JSON string is valid JavaScript as well.

Upvotes: 2

Jose Rafael Santiago Jr.
Jose Rafael Santiago Jr.

Reputation: 771

You could try using nested objects, like so:

var test={imagename:["apple.jpg","hen.jpg"],x:["13","44"],y:["33","22"]};

  $.ajax({
     type: "POST",
     url: "some.php",
     data: test,
     success: function(response){
       console.log(response);
     }
  });

Then from the PHP side, you should be able to access it as an array, by calling:

  $_POST['image name'][index_num_here];

  Example:
  $_POST['image name'][0] => "apple.jpg"

Upvotes: 2

Zut
Zut

Reputation: 639

I've used this with much success, to send JSON data to the server. It's very easy to use: 

var test={imagename: ["apple.jpg", "banana.png"],x:"13",y:"33"};
$.post('some.php', {data: JSON.stringify(test)}, function(respons) { ... });

And on the serverside you have:

<?php
$data = json_decode(urldecode($_POST['json']), true);
echo $data['imagename'][0];
echo $data['imagename'][1];
?>

Upvotes: 0

Yoram de Langen
Yoram de Langen

Reputation: 5499

A little extention on @pimvdb:

foreach($_POST['data'] as $data) {
    $filename = $data['filename'];
    $width = $data['x'];
    $height = $data['y'];

    do_something_with_it($filename, $width, $height);
}

Upvotes: 3

Related Questions