Массив данных во вложенный HTML

Question

У меня проблемы с преобразованием массива в правильно вложенный HTML.Предполагая, что у меня есть массив со следующими примерами значений -

An, Author---Some Book
Another, Author---A Book
Another, Author---Another Book
Be, Author---Book 1
Be, Author---Book 2
No, Author---Book 1

Как превратить это в организованный HTML, как -

<div>
    <div class="letter">A</div>
    <div>
        <div class="author">An, Author</div>
        <div class="title">Some Book</div>
    </div>
    <div>
        <div class="author">Another, Author</div>
        <div class="title">A Book</div>
        <div class="title">Another Book</div>
    </div>
<div>
<div>
    <div class="letter">B</div>
    <div>
        <div class="author">Be, Author</div>
        <div class="title">Book 1</div>
        <div class="title">Book 2</div>
    </div>
<div>
<div>
    <div class="letter">N</div>
    <div>
        <div class="author">No, Author</div>
        <div class="title">Book 1</div>
    </div>
<div>

У меня нет проблем с PHP,просто я не уверен, как бы я организовал данные.Разбить на три разных массива (Письма, Авторы, Книги), прежде чем объединить данные?Но тогда как мне связать книги (Письмо-> Автор-> Книга)?

Спасибо за любые идеи.

Answer 1

Предполагая, что ваш массив уже отсортирован как пример:

for ($i = 0; $i < count($array); $i++) {
    $parts = explode("---", $array[$i]);
    $author = $parts[0];
    $book = $parts[1];
    $letter = substr($author, 0, 1);

    if (!isset($last_author) || $last_author != $author) {

        if ($i > 0 && $last_letter != $letter) {
                echo "\t</div>\n";
                echo "</div>\n";
        } else if ($i > 0) {
                echo "\t</div>\n";
        }

        if (!isset($last_letter) || $last_letter != $letter) {
            echo "<div>\n";
            echo "\t" . '<div class="letter">' . strtoupper($letter) . '</div>' . "\n";
            $last_letter = $letter;
        }

        echo "\t<div>\n";

        echo "\t\t" . '<div class="author">' . $author . '</div>' . "\n";
        echo "\t\t" . '<div class="title">' . $book . '</div>' . "\n";

        $last_author = $author;

    } else {
        echo "\t\t" . '<div class="title">' . $book . '</div>' . "\n";
    }

}

if (count($array) > 0) echo "\t</div>\n</div>";

Вывод из вашего массива выборки:

<div>
        <div class="letter">A</div>
        <div>
                <div class="author">An, Author</div>
                <div class="title">Some Book</div>
        </div>
        <div>
                <div class="author">Another, Author</div>
                <div class="title">A Book</div>
                <div class="title">Another Book</div>
        </div>
</div>
<div>
        <div class="letter">B</div>
        <div>
                <div class="author">Be, Author</div>
                <div class="title">Book 1</div>
                <div class="title">Book 2</div>
        </div>
</div>
<div>
        <div class="letter">N</div>
        <div>
                <div class="author">No, Author</div>
                <div class="title">Book 1</div>
        </div>
</div>

Answer 2

У вас есть суп div, однако вы анализируете свои массивы.

Попробуйте вывести что-то осмысленное и семантическое, используя списки.

Answer 3

Вы также можете создать многомерный массив, который может потребовать меньше кода для рендеринга:

$new = array();

for ($i = 0; $i < count($array); $i++) {
    $parts = explode("---", $array[$i]);
    $author = $parts[0];
    $book = $parts[1];
    $letter = substr($author, 0, 1);

    $new[$letter][$author][] = $book;
}

foreach ($new as $letter => $authors) {

    foreach ($authors as $author => $books) {

        foreach ($books as $book) {

        }

    }

}