[FRAGE] mehrere Bilder einer ID zuordnen

[Nalia]

Hallo Leute,
ich habe mal wieder nur noch Brei im Kopf und finde keine Lösung für mein folgendes Problem:

In einer Datenbank habe ich diverse Tiere, in einem Verzeichnis liegen zu manchen Tieren eine oder mehrere Bilder.
Ich möchte eine Ausgabeliste erstellen, die mir - falls vorhanden - auch die passenden Bilder daneben anzeigt.

Die Datenbank frage ich über json ab und bekomme das array mit den Bildern und den Daten von den Tieren als result zurück. Das sieht so aus:

Array
(
    [0] => Array
        (
            [0] => pics/tier13-1_thumb.jpeg
            [1] => pics/tier13-2_thumb.jpeg
            [2] => pics/tier13-3_thumb.png
            [3] => pics/tier13-4_thumb.jpeg
            [4] => pics/tier3-1_thumb.jpeg
            [5] => pics/tier3-2_thumb.png
            [6] => pics/tier4-1_thumb.jpeg
        )

    [1] => Array
       (
            [id] => 9
            [tier] => Hund
            [name] => Bolli
       )

    [2] => Array
       (
            [id] => 4
            [tier] => Hund
            [name] => Bolli
       )
    [3] => Array
       (
            [id] => 2
            [tier] => Katze
            [name] => Minka
       )
    [4] => Array
       (
            [id] => 3
            [tier] => Hamster
            [name] => Chester
       )
)

Meine function.js sieht folgendermaßen aus:

    $.getJSON("json.php", function(result) {
        $('#body1').html('');
        for(var i=1;i<result.length;i++) {
            var row = "<tr>";
            row += "<td class='mini'>";
            for (var j=0;j<result[0].length;j++) {
                if(result[0][j].indexOf(result[i].id+'-'+j+'_') >= 0) {
                    row += "<img src='"+result[0][j]+"'   />";
                }
            }
            row += "</td><td>"+result[i].id+"</td>";
            row += "<td>"+result[i].tier+"</td>";
            row += "</tr>";
            $('#body1').append(row);

        }
    })

Das ist nun der letzte Stand der Dinge, die ich ausprobiert habe, aber ich komme einfach nicht zu dem gewünschten Resultat. Hat jemand eine Idee, wie ich die passenden Bilder zu den Tieren ausgeben kann?

LG
Nalia

 

[mikdoe]

kannst du das mal als fiddle machen damit man sich mal beides anschauen kann?

 

[SteelWheel]

Das ist gruselig, da ich ein "ständiges Iterieren" über ein Array n-Mal ziemlich unglücklich finde, um einen Treffer zu finden. Warum gibst Du die Bilder nicht direkt im JSON bereits je ID des Tieres mit? Da sparst Du Dir im Client ziemlich viel Käse. Beispiel ...

[4] => Array
       (
            [id] => 3
            [tier] => Hamster
            [name] => Chester
            [pics] => {weiteres Array mit Chester beim Hamstern, Chester beim Wursten, Chester im Mixer, Chester in der Mikrowelle, Chester unter Wasser}
       )

Wenn "pics" leer ist, gibt es den traurigen Bilderhinweis mit Dackelblick, dass für dieses Tier derzeit kein Bild vorliegt.

Außerdem, sofern der Pfad der Bilder derart simpel ist: nur die Bildernummer und den Rest dann wieder im Client zusammen stecken, um die Übertragungsgröße der JSON-Datei zu minimieren. Im Array steht dann bspw. nur "13-1", "13-2" und via JavaScript setzt Du "pics" bzw. "_thumb.jpg" erst "nach Ankunft" von JSON dran.

Grüße