Как передать массив с помощью PHP и Ajax в Javascript?

Извиняется, если это объяснение непонятно, мне тоже трудно понять. Как я могу использовать PHP и Ajax для отправки массива в Javascript? Я использую Ajax для получения массива фотографий, который затем я хочу добавить к пустой <div> на моей странице.

jQuery выглядит следующим образом:

$.ajax({
    url: "<?php echo site_url('demo/getPhotos/'); ?>",
    type: 'POST',
    data: form_data,
    success: function(data) {
        alert(data);
   }

И функция getPhotos PHP выглядит следующим образом:

<?php

$photos = array();

foreach ($data as $photo) {
    array_push($photos,$photo['source']);
    }

// echo json_encode($photos); How should I be returning $photos?

Если я просто echo $photos;, данные отправляются на обратный вызов успеха, но он не отображается в пригодном для использования формате.

Если я делаю var_dump($photos) в PHP, результат выглядит примерно так:

array(4) {
  [0]=>
  string(14) "some_image.jpg"
  [1]=>
  string(14) "some_image.jpg"
  [2]=>
  string(14) "some_image.jpg"
  [3]=>
  string(14) "some_image.jpg"
}

Я пробовал различные комбинации json_encode и тому подобное, но на самом деле я угадываю и не уверен в теории, стоящей за ней. Какой лучший способ передать данные с PHP на Javascript в этом контексте?

Ответ 1

Try:

$.ajax({
    url: "<?php echo site_url('demo/getPhotos/'); ?>",
    type: 'POST',
    data: form_data,
    dataType:"json",
    success: function(data) {
        alert(data[0]);
   }

На стороне PHP вам будет нужно печатать:

print json_encode($photos);

Еще одна вещь, которую вы можете попробовать, чтобы лучше инкапсулировать свой код, и в качестве примера дальнейшей полезности JSON, будет:

print json_encode(array("photolist"=>$photos,"photo_owner"=>"Me!"));

Затем на сервере вы получите доступ к ним с помощью

data.photolist[0]; //First photo
data.photo_owner;  //The owner of the photo set

Ответ 2

Я сделал массив $result в PHP и в конце запроса.

 echo json_encode($result);

и в JS $.post функция обработчика:

var obj = $.parseJSON(data);
var v = data.k;

где k - ключевое значение в ассоциативном массиве.

Ответ 3

json_encode - это, безусловно, путь. jQuery даже имеет встроенную поддержку для разбора JSON. Вы можете использовать, например,

$.ajax({
    url: "<?php echo site_url('demo/getPhotos/'); ?>",
    type: 'POST',
    data: form_data,
    dataType: 'json', // will automatically convert array to JavaScript
    success: function(array) {
        alert(array[0]); // alerts first string
    }
});

Ответ 4

верните сам json, а затем постройте массив в js, перейдя по json следующим образом:

var array=[];
for(var key in json)
{    
    if(json.hasOwnProperty(key))
      array.push(json[key]);
}

Или вы можете просто работать с самим json - любой причиной необходимости в массиве?

нечто вроде json [0] или json [1] и т.д.

Ответ 5

json_encode rulez, когда вам это нужно.

Я недавно узнал эту классную вещь! Вот как вы это делаете:

function jsonResponse($array) {
     header('Content-type: application/json; charset=utf-8;');
     die(json_encode($array));
}

Это необязательно, если вы хотите это сделать, вам это не обязательно, но в моей системе MVC я стараюсь писать так... Итак, сначала я делаю запрос ajax (прототип), на script, который позже вызывает эту функцию jsonResponse, о которой я упоминал ранее...

    new Ajax.Request('URL',
{
    method:'post',
    onSuccess: function(transport){
        res = transport.responseJSON;
        $('actionInformation').update(res.username);
    },
    onFailure: function(){
        alert('Something went wrong...')
    }
});

Это код jscript, обратите внимание на res.msg, здесь мы можем работать с массивом. Но, не забудьте отправить ответ в формате JSON на вашем PHP, используя функцию jsonResponse, его легко использовать, например, ваша функция php может выглядеть примерно так:

function ajax_get_user() {
     $userName = 'Adrian';
     $active = 1;
     jsonResponse(array('username' => $username, 'active' = $active));
}

Позже вы можете легко, res.username, res.active.

Я думаю, это должно сделать это!