Как разделить результаты на 3 столбца

У меня есть набор результатов (например, [1,2,3,4,5,6,7,8,9,10,11]).

Который я хочу отображать как 1 строку с 3 столбцами

1|5|9
2|6|10
3|7|11
4|8|

Я получаю 1 строку с 4 столбцами.

1|4|7
2|5|8
3|6|9

10|
11|

Пока я не добавлю 12-й объект, я получаю 1 строку с 3 столбцами

1|5|9
2|6|10
3|7|11
4|8|12

Мой код в шаблоне блейда

<!-- partials/tables/table_list.blade.php -->

@section('tables')
<?php $chunkSize = floor(count($tables) / 3); ?>
<section id="tables-overview">
    <div class="row">
        @foreach ($tables->chunk($chunkSize , 1) as $chunk)
        <div class="col-md-4">
            @include('partials.tables.table_chunk')
        </div>
        @endforeach
    </div>
</section>
@endsection

<!-- partials/tables/table_chunk.blade.php -->

<table class="table table-responsive">
<thead>
    <tr>
        <th class="text-center">@lang('table.identifier')</th>
        <th class="text-center">@lang('table.property')</th>
        <th class="text-center">
            @permission('manage-tables')
                <a href="{{ route('CreateTable') }}">@lang('action.create')</a>
            @endpermission
        </th>
    </tr>
</thead>
<tbody>
    @foreach ($chunk as $table)
    <tr>
        <td class="text-center">{{ $table->getId() }}</td>
        <td class="text-center">{{ $table->getProperty() }}</td>
        <td class="text-center">
            @permission('manage-tables')
                <a class="btn btn-primary" href="{{ route('UpdateTable', ['id' => $table->getId()]) }}">@lang('action.update')</a>
            @endpermission
        </td>
    </tr>
    @endforeach

</tbody>
</table>

Когда количество $tables можно разделить на 3 (количество столбцов, которое я хочу), я получаю 3 куска. Если нет, я получаю 3 куска + оставшиеся 1 или 2 объекта, которые оба помещаются в 4-й столбец. Я могу разместить их горизонтально, как это сделано здесь, но я считаю, что это 'странный'. При чтении списка вы сначала читаете сверху вниз, а затем слева направо.

ОБНОВЛЕНИЕ Я также пытался использовать ceil(), как предложил Хузейб Шафи. Но потом я получаю

4 objects (funny looking)
1|3|
2|4|

5 objects (better looking)
1|3|5
2|4

что тоже не на 100% то, что я хотел, но довольно близко к этому. Далее я попробую предложение Homam Alhaytham.


php twitter-bootstrap laravel laravel-5 chunks
person Steven Grauwmans    schedule 01.08.2016    source источник

Ответы (3)


arrow_upward
0
arrow_downward

Когда вы floor делите результат, вы получаете меньшее число.

Объяснение: floor(11/3) = 3. Следовательно, ваш результат делится на 3 фрагмента за раз (результат; [3,3,3,2]), однако нам нужно [4,4, 3].

Так что вам нужно ceil это. Даю вам 4, таким образом результат.

<?php $chunkSize = ceil(count($tables) / 3); ?>
person Huzaib Shafi    schedule 01.08.2016

arrow_upward
0
arrow_downward

после того, как вы получите $items путем извлечения данных из базы данных и использования примера цикла

$c=0;
echo '<div class="row">';
while(bla bla bla ..){
// counter
$c++;
echo '<div class="col-md-4">
some thing 
        </div>';
if(fmod($c,3)==0){
echo '</div><div class="row">';
}
}

echo '</div>';

здесь я использовал число fmod($c,3) 3 из ваших столбцов, и fmod возвращает 0, если $c равно 6,9,12,15,18.....

person Homam Alhaytham    schedule 01.08.2016
comment
Я также рассматривал возможность сделать это таким образом, просто думаю, что использование метода фрагментов чище, короче и проще. Несмотря на это, я мог бы просто сделать это так. - person Steven Grauwmans; 01.08.2016

arrow_upward
-1
arrow_downward

Используйте array_chunk.

Предполагая, что у вас есть следующий массив:

[
    1,
    2,
    3,
    4,
    5,
    6,
    7,
    8,
    9,
    10,
    11,
];

В вашем файле .blade.php вы можете сделать что-то вроде этого:

@section('tables')
<section id="tables-overview">
    <div class="row">
        @foreach (array_chunk($tables, 3) as  $chunk)
        <div class="col-md-4">
            @foreach($chunk as $key => $value)
            //@include('partials.tables.table_chunk')
            // No need to include anything here
            // just write your table instead of including
            @endforeach
        </div>
        @endforeach
    </div>
</section>
@endsection
person Andrei    schedule 01.08.2016
comment
Я разбиваю свои представления на более мелкие части, это делает их более читабельными для меня. И некоторые из этих крошечных фрагментов включены более чем в один вид. - person Steven Grauwmans; 01.08.2016