Question 15770 in Laravel Question posted in
The official Laravel Documentation can be found here.

How to return images sequentially inside a "for loop"? – Laravel

My view displays collections from four different tables. $redtable is my longest collection.

@for ($i = 0; $counter < $redtable->count(); $i++)
    <div>
        {{ $red->slice($i, 1)->first()?->content }}
        {{ $green->slice($i, 1)->first()?->content }}
        {{ $blue->slice($i, 1)->first()?->content }}
        {{ $gray->slice($i, 1)->first()?->content }}
    <div>
@endfor

My image table:

+----+------------------------------------+-------------------------+--------------+
| id | image                              | imageable_type          | imageable_id |
+----+------------------------------------+-------------------------+--------------+
|  1 | /path/redtable/image.png           | AppModelsRed          |            1 |
|  2 | /path/greentable/image.png         | AppModelsGreen        |            1 |
|  3 | /path/blue/image1.png              | AppModelsBlue         |            1 |
|  4 | /path/blue/image2.png              | AppModelsBlue         |            1 |
|  5 | /path/blue/image3.png              | AppModelsBlue         |            1 |
|  6 | /path/blue/image4.png              | AppModelsBlue         |            1 |
|  7 | /path/blue/image5.png              | AppModelsBlue         |            1 |
|  8 | /path/gray/image.png               | AppModelsGray         |            2 |
+----+------------------------------------+-------------------------+--------------+

My Controller:

class ColorsController extends Controller
{
    public function index()
    {
        $red = AppModelsRed::with('polymorphicRelationship')->limit(3)->orderby('id', 'desc')->get();
        $green = AppModelsGreen::with('polymorphicRelationship')->limit(3)->orderby('id', 'desc')->get();
        $blue = AppModelsBlue::with('polymorphicRelationship')->limit(3)->orderby('id', 'desc')->get();
        $gray = AppModelsGray::with('polymorphicRelationship')->limit(3)->orderby('id', 'desc')->get();
        
        return view('home.colors', [
            'red' => $red,
            'green' => $green,
            'blue' => $blue,
            'gray' => $gray
        ]);
    }

How to display the images of the "Model Blue" table in the view.

I did a test using $picture->first()?->polymorphicRelationship()->first()->image, but it only displays the image of the first line of the table.

@for ($i = 0; $counter < $red->count(); $i++)
    <div class="general">
        {{ $red->slice($i, 1)->first()?->content }}
        {{ $green->slice($i, 1)->first()?->content }}
        {{ $blue->slice($i, 1)->first()?->content }}
        <div class="slide">
            <!-- First slide image -->
            {{ $blue->polymorphicRelationship->image1 }}
            <!-- Second slide image -->
            {{ $blue->polymorphicRelationship->image1 }}
            <!-- Third slide image -->
            {{ $blue->polymorphicRelationship->image1 }}
            <!-- Fourth slide image -->
            {{ $blue->polymorphicRelationship->image1 }}
            <!-- Fifth slide image -->
            {{ $blue->polymorphicRelationship->image1 }}
        </div>
        {{ $graytable->slice($i, 1)->first()?->content }}
    </div>
@endfor
Tags:

2

Answers


  1. 0

    Assumming the relationship is defined as a polymorphic one to many, you can just add another loop.

    Also you can replace slice($i, 1)->first() with get($i).

    @for ($i = 0; $counter < $red->count(); $i++)
    <div class="general">
        {{ $red->get($i)?->content }}
        {{ $green->get($i)?->content }}
        {{ $blue->get($i)?->content }}
        <div class="slide">
            @foreach ($blue->polymorphicRelationship as $image)
                {{ $image->image }}
            @endforeach
        </div>
        {{ $graytable->get($i)?->content }}
    </div>
@endfor
    Login or Signup to reply.
  2. 0

    I think to display the images of the Blue table in the view sequentially, you need to retrieve the images for each row of the Blue table separately. One way to do this is to loop through the rows of the Blue table along with the other tables and display the images of each row in a separate slide.

    @for ($i = 0; $i < $red->count(); $i++)
    <div class="general">
        {{ $red->slice($i, 1)->first()?->content }}
        {{ $green->slice($i, 1)->first()?->content }}
        @if ($i < $blue->count())
            <div class="slide">
                @foreach ($blue[$i]->polymorphicRelationship->images as $image)
                    <img src="{{ $image->image }}" alt="">
                @endforeach
            </div>
        @endif
        {{ $gray->slice($i, 1)->first()?->content }}
    </div>
@endfor
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search