I have a foreach loop and inside that contains html with bootstrap columns.
#foreach($address as $add)
<div class="col-md-6">
Some data
</div>
#endforeach
However, bootstrap requires the row div before creating columns, placing that straight in to the foreach loop would create a row div for each col-md-6. I want to know how I can throw in the row div, skip the next loop throwing in only the closing div tag. And then repeat that process.
Example output where the loops 4 times:
<div class="row">
<div class="col-md-6">
Some data
</div>
<div class="col-md-6">
Some data
</div>
</div>
<div class="row">
<div class="col-md-6">
Some data
</div>
<div class="col-md-6">
Some data
</div>
</div>
As an alternative to Alexey Mezenin's answer you could use array_chunk instead. http://php.net/manual/en/function.array-chunk.php
#foreach(array_chunk($address, 2) as $chunk)
<div class="row">
#foreach($chunk as $add)
<div class="col-md-6">
Some data
</div>
#endforeach
</div>
#endforeach
I personally find the the above a little more readable.
Alternatively, if $address is a collection you could do $address->chunk(2) instead of array_chunk($address, 2).
If you want to change the amount of columns you have you would simply need to change the 2 to be however many columns you want.
You can use Laravel chunk in the blade template.
#foreach($products->chunk(3) as $items)
<div class="row">
#foreach($items as $item)
<div class="col-md-4 portfolio-item">
<a href="#">
<img class="img-responsive" src="{{ 'uploads/'.$item->product_image_url }}" alt="">
</a>
<h3>
{{ $item->product_name }}
</h3>
<p>{{ str_limit($item->product_description, 121) }}</p>
</div>
#endforeach
</div>
#endforeach
Copied from the blogpost.
Use the $loop variable:
<div class="row">
#foreach($address as $add)
<div class="col-md-6">
Some data
</div>
#if ($loop->iteration % 2 == 0)
</div>
<div class="row">
#endif
#endforeach
</div>
Related
I have this:
#foreach($portfolios as $portfolio)
<div id="item-portfolio-expand{{$portfolio->id}}" class="item-portfolio-expand expand">
<div class="container">
<div class="row">
<div class="col-md-8">
col-md-8
</div>
<div class="col-md-4">
{{ __('Name')}}: {{ $portfolio->name }}
</div>
</div>
</div>
</div>
#endforeach
And this:
#foreach ($portfolios as $portfolio)
<div class="portfolio-item {{ $portfolio->tag }} " data-category="transition">
<img src="{{ $portfolio->image_show }}">
<a href="#item-portfolio-expand{{$portfolio->id}}" data-toggle="collapse" data-target="#item-portfolio-expand{{$portfolio->id}}" data-parent="#item-portfolio-expand{{$portfolio->id}}">
<div class="portfolio-item-overlay">
<p class="name-item-overlay">{{ $portfolio->name }}</p>
</div>
</a>
</div>
#endforeach
And when I press the in the first foreach, I want to toggle the second foreach at <div id = "item-portfolio-expand {{$ portfolio-> id}}" class = "item- portfolio-expand expand "> I just don't succeed at anything, I use bootstrap and jquery in the project. .item-portfolio-expand has display: none;
And at the same time when one is open and another is selected, to close the one already open and to appear the one selected with toggle.
I am new to Laravel. I am trying a loop through a multiple div and struck in between. I want to wrap a div with multiple columns in it.
#foreach($products as $product)
<div>
<div class="row">
#foreach($products as $product)
<div class="col-md-4">
{{image}}
</div>
#endforeach
</div>
</div>
#endforeach
It's not printing the expected output. my expected output should be like.
<div>
<div class="row">
<div class="col-md-4">image1</div>
<div class="col-md-4">image2</div>
<div class="col-md-4">image3</div>
</div>
</div>
<div>
<div class="row">
<div class="col-md-4">image4</div>
<div class="col-md-4">image5</div>
<div class="col-md-4">image6</div>
</div>
</div>
How can I print div properly with the above formate?
Try using Collection Chunks:
#foreach($products->chunk(3) as $chunk)
<div class="row">
#foreach($chunk as $product)
<div class="col-md-4">
YOUR IMAGE HERE
</div>
#endforeach
</div>
#endforeach
Try this?
<div class="row">
#for($i = 1; $i <= len($products); $i++)
<div class="col-md-4">
Title: {{$products[$i-1]->title }}
</div>
#if($i%3===0)
</div> <div class="row">
#endif
#endfor
</div>
#for($i = 0; $i < count($products); $i++)
<div>
<div class="row">
#foreach($products as $product)
<div class="col-md-4">
{{image}}
</div>
#endforeach
</div>
</div>
#endfor
I am trying to switch over a site to Bootstrap 4 from Bootstrap3 and having an issue with the Grid "row" option when nesting with looping through a PHP Laravel #foreach loop.
The code that I have tried in different ways looks like:
<div class="row">
<div class="col-12">
<div class="row">
#foreach($sofas as $sofa)
#if(isset($sofa['Sub']))
<a href="{{ Request::url() }}/{{ $sofa['Style'] }}">
<div class="col-12 col-sm-4 col-md-3" style="padding:0 5px 0 5px;">
<div class="product_tile">
<div class="product_tile_style">{{ $sofa['StyleName'] }}</div>
<div class="product_tile_frame">Frame {{ $sofa['Style'] }}</div>
<div class="product_tile_thumb">
<img width="200" height="140" src="/imagelib/bigthumbs/{{ $sofa['url'] }} " alt="">
</div>
</div>
</div>
</a>
#endif
#endforeach
</div>
</div>
The expected outcome should look like the following:
Example of what it should look like.
And this is the random mess that I am getting where it is shrinking everything and not expanding to the columns.
Example of what I am getting which is wrong.
Any ideas and help would be greatly appreciated.
Thank you all in advance!
How to divide a file into multiple files with laravel or php?
For example:
There is a file demo.blade.php:
<div class="card-block">
<div class="row">
<div class="col-1">fruits</div>
<div class="col-11">
apple,pear,peach
</div>
</div>
</div>
<div class="card-block">
<div class="row">
<div class="col-1">aminals</div>
<div class="col-11">
cat,dog,calf
</div>
</div>
</div>
<div class="card-block">
<div class="row">
<div class="col-1">vehicles</div>
<div class="col-11">
car,bus,motorbike
</div>
</div>
</div>
I want to write some code to divide the demo.blade.php into three files:
fruits.blade.php
aminals.blade.php
vehicles.blade.php
The content is each <div class="card-block"></div>.
How to do it?
Any help would be appreciated.
You can use other blade in your blade file like this :
#include('fruits.blade.php')
#include('aminals.blade.php')
#include('vehicles.blade.php')
But this is not a good idea. Instead you can make a template like this :
<div class="card-block">
<div class="row">
<div class="col-1">{{ $title }}</div>
<div class="col-11">
{{ $content }}
</div>
</div>
</div>
And use it everywhere :
#include('template', ['title' => 'foo', 'content' => 'bar'])
Anyway I don't know your purpose of doing this. And you can explain more to give you more examples.
You can also use Blade Components
//This is the template cardblock.blade.php
<div class="card-block">
<div class="row">
<div class="col-1">{{ $title }}</div>
<div class="col-11">
{{ $slot }}
</div>
</div>
</div>
And you can use it like this
#component('cardblock')
#slot('title')
fruits
#endslot
apple,pear,peach
#endcomponent
#component('cardblock')
#slot('title')
aminals
#endslot
cat,dog,calf
#endcomponent
#component('cardblock')
#slot('title')
vehicles
#endslot
car,bus,motorbike
#endcomponent
I need to create a row for each 3 attachments. Something like
#foreach($email->attachment as $attach)
<div class="row">
<div class="col-lg-4"></div>
<div class="col-lg-4"></div>
<div class="col-lg-4"></div>
</div>
#endforeach
<div class="row">
<div class="col-lg-4">1st attachment</div>
<div class="col-lg-4">2nd attachment</div>
<div class="col-lg-4">3rd attachment</div>
</div>
<div class="row">
<div class="col-lg-4">4th attachment</div>
<div class="col-lg-4">5th attachment</div>
<div class="col-lg-4">6th attachment</div>
</div>
and so on! I had searched for the question but just found This link but It's actually different from my perspective.
Thanks
Use array_chunk - it is designed for this each purpose - so you can cut an array into sub-sizes and loop through each group
#foreach (array_chunk($email->attachment->toArray(), 3, true) as $array)
<div class="row">
#foreach($array as $attachment)
<div class="col-lg-4">{{ $attachment['id'] }}</div>
#endforeach
</div>
#endforeach
And using #Lukasgeiter's comment - you could also do it this way if it is a Laravel Collection
#foreach ($email->attachment->chunk(3) as $array)
<div class="row">
#foreach($array as $attachment)
<div class="col-lg-4">{{ $attachment->id }}</div>
#endforeach
</div>
#endforeach
Try this, it's faster than generate 2 arrays:
<div class="row">
#foreach( $email->attachment as $index => $attach)
<div class="col-lg-4">{{$attach}}</div>
#if( $index+1 === 0)
</div><div class="row">
#endif
#endforeach
</div>