ProcessWire foreach 循环以在每行中显示 4 列

Question

我已经在该网站上工作了一段时间，并且在创建特定的 foreach 循环时偶然发现了一个问题。我正在使用 ProcessWire 为网站创建 CMS。我想在每一行中显示 4 列，但我感到困惑。到目前为止，这是我的代码；

<div class="container">
<? $count == 0; ?>      
        <? foreach($page->events_tickets as $cols): ?>
        <!-- portfolio item -->
        <? if ($count % 4 == 0)
            echo "<div class='row'>";
        ?>
            <? for($count = 0; $count < 4; $count++) { ?>
            <div class="span3  project-item graphics box">
                <div class="thumbnail" >
                    <!-- IMAGE CONTAINER-->
                    <a rel="prettyPhoto[gallery]" href="<?=$cols->event_url;?>" title="portfolio image">
                        <img src="<?=$cols->event_img->url;?>" alt="<?=$cols->event_img->description;?>" /> 
                    </a>
                    <!--END IMAGE CONTAINER-->
                    <!-- CAPTION --> 
                    <div class="caption">
                        <h4 class=""><?=$cols->event_title;?></h4>
                            <p class="caption-descr" id="opening-reception" style="height: 190px; overflow:auto;">
                            <?=$cols->event_desc;?> <a href="<?=$cols->event_url;?>" target="_blank" style="" title=""> BUY TICKETS</a> 
                            </p>    
                    </div><!--END CAPTION --> 
                </div><!-- END: THUMBNAIL -->
            </div><!-- END: portfolio item -->
            <? if($count % 1 = 1 ) break;} ?>
            </div>  <!--END OF ROW-->
        <? endforeach; ?>

Answer 1

没关系，我终于找到了解决方法。我决定运行通过条件 if else 语句的循环，而不是使用嵌套循环。

<div class="row">
            <? foreach($page->events_tickets as $cols): ?>
            <? if($cols->event_num % 4 != 0) {?>
            <!-- portfolio item -->
                <div class="span3  project-item graphics box">
                    <div class="thumbnail" >
                        <!-- IMAGE CONTAINER-->
                        <a rel="prettyPhoto[gallery]" href="<?=$cols->event_url;?>" title="portfolio image">
                            <img src="<?=$cols->event_img->url;?>" alt="<?=$cols->event_img->description;?>" /> 
                        </a>
                        <!--END IMAGE CONTAINER-->
                        <!-- CAPTION --> 
                        <div class="caption">
                            <h4 class=""><?=$cols->event_title;?></h4>
                                <p class="caption-descr" id="opening-reception" style="height: 190px; overflow:auto;">
                                <?=$cols->event_desc;?> <a href="<?=$cols->event_url;?>" target="_blank" style="" title=""> BUY TICKETS</a> 
                                </p>    
                        </div><!--END CAPTION --> 
                    </div><!-- END: THUMBNAIL -->
                </div><!-- END: portfolio item -->

            <? } else if($cols->event_num%4 == 0) {?>
            <div class="row">
                <div class="span3  project-item graphics box">
                        <div class="thumbnail" >
                            <!-- IMAGE CONTAINER-->
                            <a rel="prettyPhoto[gallery]" href="<?=$cols->event_url;?>" title="portfolio image">
                                <img src="<?=$cols->event_img->url;?>" alt="<?=$cols->event_img->description;?>" /> 
                            </a>
                            <!--END IMAGE CONTAINER-->
                            <!-- CAPTION --> 
                            <div class="caption">
                                <h4 class=""><?=$cols->event_title;?></h4>
                                    <p class="caption-descr" id="opening-reception" style="height: 190px; overflow:auto;">
                                    <?=$cols->event_desc;?> <a href="<?=$cols->event_url;?>" target="_blank" style="" title=""> BUY TICKETS</a> 
                                    </p>    
                            </div><!--END CAPTION --> 
                        </div><!-- END: THUMBNAIL -->
                    </div><!-- END: portfolio item -->
                    </div>  <!--END OF ROW-->
                <? } ?> 
            <? endforeach; ?>
        </div>  <!--END OF ROW-->

我在 events_tickets 字段中添加了额外的字段并将其命名为 events_num。 events_num 从 1 开始，一直到记录结束。<? if($cols->event_num % 4 != 0) {?> 然后显示 4 列。然后如果数字达到 5 除以 4 的余数是奇数，因此它创建 <div class="row"> 并显示另外 4 列。然后这个过程继续。因此不需要创建嵌套循环。

ProcessWire foreach 循环以在每行中显示 4 列

ProcessWire foreach loop to show 4 colums in each row

php

html

css

processwire