Какой самый чистый способ заполнить представление шаблона в php при обходе данных многомерного массива на стороне клиента? - PullRequest
0 голосов
/ 16 сентября 2018

Прекурсор : Это немного углубленный вопрос.Извиняюсь заранее.

Я новичок в использовании PHP, и поскольку PHP является требованием к продукту, мне нужна небольшая помощь.

Обзор : Я создал шаблон-прототип и импортировал мои данные, а также декодировал их.Вы можете просмотреть print_r() версию этого в гисте, расположенном здесь .

Я также создал многоуровневый цикл foreach, который позволяет мне добраться до самой нижней точкииз набора данных.

В сторону : я знаю, что это определенно не элегантно, и я был бы признателен за предложения о более кратком способе сделать это.Я бы предположил рекурсивное решение, но не уверен в настоящее время.

Вы можете увидеть этот бесполезный беспорядок ниже:

function array_push_assoc(&$array, $key, $value){
    $array[$key] = $value;
    return $array;
}

$tab_names = array();
$products =array();

foreach ($connectors_session as $key => $val) {
foreach ($val as $k => $v) {        
    if ($k == 'name') {
        array_push($tab_names, $v);
    } elseif ($k == 'products') {
        foreach ($v as $pk => $pv) {
                array_push_assoc($products, $pk, $pv);
            foreach ($pv as $kp => $vp) {
                if($kp == 'series') {
                    foreach ($vp as $sk => $sv) {
                        foreach ($sv as $ks => $kv) {
                            if($ks == 'releases') {
                                foreach ($kv as $kr => $vr) {
                                    foreach ($vr as $rk => $rv) {
                                        if($rk == 'files') {
                                            foreach ($rv as $fk => $fv) {
                                                foreach ($fv as $kf => $vf) {
                                                    // echo $kf . ':'. $vf.'<br>';
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }

                    }
                }
            }               
        }
    } else {
    // Do something else
    }
  } 
}

Псевдокод : Для каждого элемента, проходить по циклу, захватить элемент клавишей и заполнить область просмотра с помощьюуказанный элемент.Если значение элемента является массивом, выполните цикл по массиву, найдите конкретный ключ, заполните представление, повторите промывку.

Проблема : Все это должно быть сделано на стороне клиента, без JavaScript.Я создал переменные и могу вставить определенные значения в эти переменные.Это работает для определенных частей шаблона, но мне нужно контролировать весь вид ( см. Пример изображения ниже ) на уровне Product набора данных.

Способ работы представления заключается в том, что имеется контейнер со строкой и двумя столбцами.Один столбец содержит набор навигационных ссылок (каждая ссылка является одним из продуктов, соответствующих названию ссылки), а второй справа содержит форму <select> s, в которой должны находиться вышеупомянутые элементы продуктов.Точно так же нижняя зеленая область находится в исходном контейнере, но содержимое должно измениться в зависимости от <select> правых входных данных.

Процесс мышления: Я думаю, что если я пройду черезПродукты раздел данных и заполнить мое мнение на основе этого, я могу удовлетворить требования.Исходя из вышесказанного, я установил цикл foreach для прохождения через заполненный ранее массив продуктов, который, на мой взгляд, должен зацикливать весь вид в корневом контейнере, чтобы охватить все элементы внутри.

Когда я включаю цикл, весь вид дублируется.Мне нужно иметь возможность проходить через эту часть представления и успешно заполнять элементы, как я мог делать с вышеупомянутыми переменными, которые я создал.Любая помощь будет принята с благодарностью и еще раз, я заранее прошу прощения за этот список белья.

View Image

См. Шаблон представления ниже:

    <?php //foreach($products as $key => $value) { ?>

<div class="col-7 col-lg-8 ">

    <div class="feature-description">

        <div class="row">
            <div class="col-3 bg-light">

                <div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical">

                    <?php foreach($tab_names as $key => $value) { ?>

                        <?php if($key==0) { ?>

                            <a class="nav-link active" id="v-pills-home-tab" data-toggle="pill" href="#v-pills-home" role="tab"
                            aria-controls="v-pills-home" aria-selected="true"><?=$value;?></a>

                        <?php }else{ ?>

                            <a class="nav-link" id="v-pills-profile-tab" data-toggle="pill" href="#v-pills-profile" role="tab"
                            aria-controls="v-pills-profile" aria-selected="false"><?=$value;?></a>

                        <?php } ?>

                    <?php } ?>  

                </div>
            </div>
            <div class="col-9">

                <div class="tab-content" id="v-pills-tabContent">
                    <div class="tab-pane fade show active" id="v-pills-home" role="tabpanel" aria-labelledby="v-pills-home-tab">
                        <p>Cillum ad ut irure tempor velit nostrud occaecat ullamco aliqua anim Lorem sint. Veniam sint duis
                            incididunt do esse magna
                            mollit excepteur laborum qui. Id id reprehenderit sit est eu aliqua occaecat quis et</p>

                        <p>velit excepteur laborum mollit dolore eiusmod.
                            Ipsum dolor in occaecat commodo et voluptate minim reprehenderit mollit pariatur. Deserunt non laborum
                            enim et cillum eu deserunt
                            excepteur ea incididunt minim occaecat.</p>

                        <div class="row">
                            <div class="col">
                                <a href="">Link</a>
                            </div>
                        </div>

                    </div>
                    <div class="tab-pane fade" id="v-pills-profile" role="tabpanel" aria-labelledby="v-pills-profile-tab">

                    </div>
                </div>
            </div>
        </div>

    </div>
</div>

<div class="col-4 col-lg-4 ">
    <!-- <form> -->
    <div class="service-form">

        <div class="row h-100 justify-content-center align-items-center">

            <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">

                <form>

                    <div class="form-group row">
                        <label for="select-item" class="col-sm-2 col-form-label">Client</label>
                        <div class="col-sm-10">
                            <select id="select-item" class="form-control">

                                <option>1</option>
                                <option>2</option>
                                <option>3</option>

                            </select>
                        </div>
                    </div>

                    <div class="form-group row">
                        <label for="select-item" class="col-sm-2 col-form-label">Version</label>
                        <div class="col-sm-10">
                            <select id="select-item" class="form-control">

                                <option>1</option>
                                <option>2</option>
                                <option>3</option>

                            </select>
                        </div>
                    </div>

                </form>


            </div>

        </div>

    </div><!-- service-form -->

</div>

<nav class="navbar navbar-expand-lg w-100 rounded p-4 text-white my-5" style="background: #acca42;">

    <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto text-white">
            <li class="nav-item pr-5">
                <a class="nav-link text-white" href="#">Download Link</a>
            </li>
        </ul>
        <a class="nav-link text-white" href="#">Download Size</a>
        <button class="btn my-2 my-sm-0 border border-white text-white" type="submit" style="background: transparent;">Download</button>

    </div>
</nav>

</div><!-- Content + Margins -->

<?php //} ?>
...