Foreachloop手风琴的标题每2秒关闭一次，机身每2秒关闭一次，但包含在一行中

Question

因此，我试图在这种意义上建立一个特殊的手风琴或折叠，因为它是Bootstrap，而且我很难得到代码合作。

我正在使用foreach循环显示中继器。在它内部，我有头部和身体。我做了每个2行。但是，这是我需要的布局。我需要1行来保存标题和正文，然后在其中再添加2行。一行是标题，一行是正文。这种方式的内容是在标题下的全部范围。

这是一个视觉什么我讲的

的我不知道我的代码是什么，我做错了。我试过运行一个foreach循环两次，我已经尝试了循环内的一个模数来关闭标题行并重新打开它，对于body也是一样的。然而，那根本不好。每一个奇怪的物品打开和关闭头，就是这样。正文包含在标题中。

我没有什么现场展示，但这里是我的代码：

<div class="panel-group" id="accordion_<?php echo $accordion_widget_title; ?>" role="tablist" aria-multiselectable="true"> 
    <div class="panel panel-default"> 
    <?php $x = 1; ?> 
    <?php foreach($instance['row_repeater'] as $i => $repeater) : 

     // Concatenate the Accordion Title, then convert it to a lower case string 
     $accordion_title = preg_replace('/\s+/', '-', $repeater[ 'row_accordion_title' ]); 
     $accordion_title = strtolower($accordion_title); 
     $accordion_title = $accordion_title . '_' . $x; 

     // Start Accordion Title Loop ?> 
     <div class="panel-heading" role="tab" id="heading-<?php echo $accordion_title; ?>"> 
     <a role="button" data-toggle="collapse" data-parent="#accordion-<?php echo $accordion_widget_title; ?>" href="#item-<?php echo $accordion_title; ?>" aria-expanded="false" aria-controls="item-<?php echo $accordion_title; ?>"> 
      <h4 class="panel-title"> 
      <?php _e($repeater[ 'row_accordion_title' ], 'boss'); ?> 
      </h4> 
     </a> 
     </div> 

    <?php if (($x % 2 == 0)) : ?> 
     </div><div class="panel panel-default"> 
    <?php endif; ?> 

    <?php $x++; ?> 
<?php endforeach; ?> 

    <div class="panel panel-default"> 
     <?php foreach($instance['row_repeater'] as $i => $repeater) : 
     // Concatenate the Accordion Title, then convert it to a lower case string 
     $accordion_title = preg_replace('/\s+/', '-', $repeater[ 'row_accordion_title' ]); 
     $accordion_title = strtolower($accordion_title); 
     $accordion_title = $accordion_title . '_' . $x; 
     // Start Accordion Title Content ?> 
     <div id="item-<?php echo $accordion_title; ?>" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading-<?php echo $accordion_title; ?>"> 
     <div class="panel-body"> 
      <?php _e($repeater[ 'row_accordion_content' ], 'boss'); ?> 
     </div> 
     </div> 
     <?php if (($x % 2 == 0) ) : ?> 
     </div><div class="panel panel-default"> 
     <?php endif; ?> 

    <?php $x++; ?> 
    <?php endforeach; ?> 
</div> 

这里是什么，我已经试过

<div class="panel-group<?php if (!empty($additional_class)) : echo $additional_class; endif; ?>" id="accordion_<?php echo $accordion_widget_title; ?>" role="tablist" aria-multiselectable="true"> 
    <?php $x = 1; ?> 
    <?php foreach($instance['row_repeater'] as $i => $repeater) : ?> 
     <?php 
     // Concatenate the Accordion Title, then convert it to a lower case string 
     $accordion_title = preg_replace('/\s+/', '-', $repeater[ 'row_accordion_title' ]); 
      $accordion_title = strtolower($accordion_title); 
      $accordion_title = $accordion_title . '_' . $x; 
     ?> 
     <?php // Start Accordion Title Loop ?> 
     <?php if (($x % 2 == 1) || ($x == 1)) : ?> 
     <div class="panel panel-default"> 
     <?php endif; ?> 

      <div class="panel-heading" role="tab" id="heading-<?php echo $accordion_title; ?>"> 
      <a role="button" data-toggle="collapse" data-parent="#accordion-<?php echo $accordion_widget_title; ?>" href="#item-<?php echo $accordion_title; ?>" aria-expanded="false" aria-controls="item-<?php echo $accordion_title; ?>"> 
       <h4 class="panel-title"> 
       <?php _e($repeater[ 'row_accordion_title' ], 'boss'); ?> 
       </h4> 
      </a> 
      </div> 

     <?php $x++; ?> 
     <?php if (($x % 2 == 1) || ($x == 1)) : ?> 
     </div> 
     <?php endif; ?> 
    <?php endforeach; ?> 
</div> 

<div class="panel-group" data-parent="#accordion-<?php echo $accordion_widget_title; ?>" id="accordion_<?php echo $accordion_widget_title; ?>" role="tablist" aria-multiselectable="true"> 
    <?php $x = 1; ?> 
     <?php foreach($instance['row_repeater'] as $i => $repeater) : ?> 

      <?php 
      // Concatenate the Accordion Title, then convert it to a lower case string 
      $accordion_title = preg_replace('/\s+/', '-', $repeater[ 'row_accordion_title' ]); 
      $accordion_title = strtolower($accordion_title); 
      $accordion_title = $accordion_title . '_' . $x; 
      ?> 
     <?php // Start Accordion Title Content ?> 
     <?php if (($x % 2 == 1) || ($x == 1)) : ?> 
      <div class="panel-body-row"> 
     <?php endif; ?> 
      <div id="item-<?php echo $accordion_title; ?>" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading-<?php echo $accordion_title; ?>"> 
       <div class="panel-body"> 
       <?php _e($repeater[ 'row_accordion_content' ], 'boss'); ?> 
       </div> 
      </div> 
      <?php $x++; ?> 
      <?php if (($x % 2 == 1) || ($x == 1)) : ?> 
      </div> 
      <?php endif; ?> 

     <?php endforeach; ?> 
</div> 

另一种变化，我只是没有100 ％确定它是什么我没有抓住。

Answer 1

我其实认为PHP函数array_chunk会让你的生活更轻松。 http://php.net/manual/en/function.array-chunk.php

我不会尝试重新在这里你所有的HTML，但这里的基本想法，你可以使用：

//Split our repeaters into an array of arrays, each with 2 elements 
$rows = array_chunk($instance['row_repeater'], 2); 

foreach($rows as $row){ 
    echo "<div class='row'>"; 
    foreach($row as $items){ 
     echo "<div class='col-sm-6'>"; 
     echo $items('row_accordion_title'); 
     // echo the rest of your repeater stuff... 
     echo "</div>"; 
    } 
    echo "</div>"; 
} 

Answer 2

我认为您使用PHP生成HTML的方法使得难以排除故障。您应该让foreach循环包含您为每次迭代尝试实现的整个html输出，以便更容易跟踪。此外，我会确保您正在为可折叠元素创建一组增量ID，以避免混淆Boostrap的JS组件。例如：

<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"> 
    <?php 
    for($i = 0; $i < count($instance['row_repeater']); $i++){ 
    $accordion_title = preg_replace('/\s+/', '-', $instance['row_repeater'][$i][ 'row_accordion_title' ]); 
    $accordion_title = strtolower($accordion_title); 
    $accordion_title = $accordion_title . '_' . $x; 

    $out = "<div class=\"panel panel-default\"> 
    <div class=\"panel-heading\" role=\"tab\" id=\"heading".$i+1."\"> 
     <h4 class=\"panel-title\"> 
     <a role=\"button\" data-toggle=\"collapse\" data-parent=\"#accordion\" href=\"#collapse".$i+1."\" aria-expanded=\"true\" aria-controls=\"collapse".$i+1."\"> 
      ".$accordion_title." 
     </a> 
     </h4> 
    </div> 
    <div id=\"collapse".$i+1."\" class=\"panel-collapse collapse in\" role=\"tabpanel\" aria-labelledby=\"heading".$i+1."\"> 
     <div class=\"panel-body\"> 
      ".$instance['row_repeater'][$i][ 'row_accordion_content' ]." 
     </div> 
     </div> 
    </div>"; 
    echo $out; 
    } 
    ?> 
    </div> 

这样做将有助于简化循环，并更轻松地跟踪代码中的问题。此外，在$ for循环中使用$ i的迭代，可以确保创建唯一ID以防止引导触发器相互踩ste。希望这可以帮助