在客户端遍历多维数组数据时,用php填充模板视图的最干净方法是什么?

时间:2018-09-16 20:09:18

标签: php wordpress multidimensional-array foreach

先驱:这是一个深入的问题。提前致歉。

我是使用PHP的新手,由于PHP是产品要求,因此我需要一些帮助。

概述:我创建了一个原型模板,并导入了我的数据并对其进行了解码。您可以在here.的要旨中查看其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。 我已经创建了变量,并且能够将某些值推入那些变量中。这适用于模板的某些部分,但是我需要在数据集的“产品”级别控制整个视图( 请参见下面的图像示例 )。

视图的工作方式是有一个包含一行和两列的容器。一列包含一组导航链接(每个链接是对应于链接名称的产品之一),而第二列在右侧包含<select>表格,这些表格应包含上述产品项。同样,底部的绿色区域位于初始容器中,但是内容应根据右侧的<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 //} ?>

0 个答案:

没有答案