looping through multiple arrays in JQuery from a multi array JSON response

Question

Am I on the wrong path here?

I have a ajax call to upload some files.

I then create a array on the PHP side and send it back as JSON. But im not sure if the JSON format is correct.

Problem is I want to populate a dataTable with the returned JSON data, but I having difficulty reading the data. If its a single file then its fine and it works, but as soon as its more than one file

PHP CODE

        $stmt = $db->prepare("SELECT * FROM {$table} WHERE uuid = :id");
        $stmt->execute(array(":id" => $id));
        $row = $stmt->fetch();
        $json = array();

        $json[] = $row;
        echo json_encode($json);

on the JQuery/AJAX call side

$(document).ready(function() {
    $('#myfiles').on("change", function() {
        var myfiles = document.getElementById("myfiles");
        var files = myfiles.files;
        var data = new FormData();

        for (i = 0; i < files.length; i++) {
            data.append('file' + i, files[i]);
        }

        $.ajax({
            url: './inc/MediaScripts.php',
            type: 'POST',
            contentType: false,
            data: data,
            processData: false,
            cache: false
        }).done(function(html) {

            var t = $('#vidlib_dtable').DataTable();
            var obj = eval(html);
            $.each(obj, function(key,value) {
                t.row.add( [
                    value.name,
                    value.title,
                    value.path,
                    value.duration,
                    value.uploaded_date,
                    value.uploaded_by,
                    value.keyword,
                    value.comment,
                ] ).draw();
            });

        });
    });
});

The original return has more columns, hence the above columns in the dataTable add.

The return looks like multiple (singular) JSON arrays.

[{"uuid":"236","name":"Koala.jpg"}] [{"uuid":"237","name":"Lighthouse.jpg"}]

I was wondering if it should not take the shape of something like this

[{"uuid":"236","name":"Koala.jpg"}, {"uuid":"237","name":"Lighthouse.jpg"}]

If the format that I receive the data in is fine, how do I go about looping trhough the multiple arrays on the JQuery side?

It should be an array of objects -> array[object{}, object{}, object{}, ...etc] (your second example) (Allowing you to iterate it correctly :-) ). Not array[object{}] array[object{}] — Darren
– Darren, Commented Jul 18, 2014 at 8:08
@darren thanks, but how do i structure that on the php side. Is the php calle multiple times (per file), or the the AJAX call to php on multi files handled in one go? — morne
– morne, Commented Jul 18, 2014 at 8:10
That depends how you upload them (you're uploading them right?). Can users upload multiple files at once or do they do it one at a time? — Darren
– Darren, Commented Jul 18, 2014 at 8:12
you can select more than one file at anyone time to upload. I just put an die(print_r($json)); before the echo in php and saw that it returns one array at a time. Does AJAX then wait for the 'completion' of the expected data to be returned? — morne
– morne, Commented Jul 18, 2014 at 8:16
maybe the .done() can be something else to handle each returned array on its own? — morne
– morne, Commented Jul 18, 2014 at 8:19

Zander Rootman · Accepted Answer · 2014-07-18 08:44:05Z

1

That's because you are echo'ing 3 different JSON object arrays. Each time your loop iterates you echo, the loop then re-creates the array and echo's the new JSON array.

$json = array();
//forloop{ START
    $stmt = $db->prepare("SELECT * FROM {$table} WHERE uuid = :id");
    $stmt->execute(array(":id" => $id));
    $row = $stmt->fetch();
    array_push($json, $row);
//} END
echo json_encode($json);

Initialize your array before the loop, and echo it after it's been fully created.

answered Jul 18, 2014 at 8:44

Zander Rootman

2,2082 gold badges19 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

morne Over a year ago

indeed. simple solution or just me looking so hard at the problem and not seeing the bigger picture. @Zander Rootman thanks.

Collectives™ on Stack Overflow

looping through multiple arrays in JQuery from a multi array JSON response

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related