CODEWITHSUNDEEP
phplaravellaravel-blade
Rafael Munoz
Rafael Munoz

Reputation: 656

Laravel: Pass a variable to a tab without using Javascript

I am building an index page in whicgh I show the orders separated in three tables: "incoming", "in_progress", "ready"

Essencially is this same table shown three times (and separated into a different tab)

<table class="table table-striped table-hover dataTables-example">
    <thead class="thead-dark">
        <tr>
            <th>Id</th>
            <th>Eingang</th>
            <th>Auftrag id</th>
            <th>Ort</th>
        </tr>
    </thead>
    <tbody>
        @foreach($all_ as $element)
        @if($element->status === 'in_progress')
        <tr>
            <td>{{$element->id}}</td>
            <td class="gradeX">{!! $element->created_at->format('D j M Y, G:i:s') !!}</td>
            <td><a href="{{route('orders.show', $element->title)}}">{!! $element->title !!}</a></td>
            <td>{!! $element->address->plz->locality !!}</td>
        </tr>
        @endif
        @endforeach
    </tbody>
</table>

I saved the table in a different file and I called it like this: @include('dashboard.orders.includes.table_orders')

....
<div class="tab-content py-3 px-3 px-sm-0" id="nav-tabContent">
    <div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">
        <!-- I need to call here the partial and pass status="incoming" -->
        @include('dashboard.orders.includes.table_orders')
    </div>

    <div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">
        <!-- I need to call here the partial and pass status="in progress" -->
        @include('dashboard.orders.includes.table_orders')
    </div>

    <div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">
        <!-- I need to call here the partial and pass status="ready" -->
        @include('dashboard.orders.includes.table_orders')
    </div>
</div>

The model looks lilke this:

$element [
    "id" => 1
    "title" => "KFZ_0001_May_2019"
    "details" => "Lorem Ipsums dolor..."
    "status" => "in progress"    // <---or incoming or ready
    "created_at" => "2019-05-31 09:14:02"
    "updated_at" => "2019-05-31 11:16:55"
    "deleted_at" => null
  ]

The question is:

How do I call the external partial and pass the "status" variable in order to show the orders separated each in its corresponding table?

All the three tables are show in the same page!

I would like to avoid using of javascript just for that.

Upvotes: 1

Views: 255

Answers (3)

gbalduzzi
gbalduzzi

Reputation: 10176

You can pass a variable to the blade file included just by passing an array as the second parameter:

<div class="tab-content py-3 px-3 px-sm-0" id="nav-tabContent">
    <div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">
        @include('dashboard.orders.includes.table_orders', ['status' => 'incoming'])
    </div>

    <div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">
        @include('dashboard.orders.includes.table_orders', ['status' => 'in_progress'])
    </div>

    <div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">
        @include('dashboard.orders.includes.table_orders', ['status' => 'ready'])
    </div>
</div>

and inside your table_orders template:

@foreach($all_ as $element)
    @if($element->status === $status)
    <tr>
        {{ .. your row format }}
    </tr>
    @endif
@endforeach

If you want to further generalize your code, without the need to repeat 3 times the same inclusion and to easily add different statuses, you could pass to the view an object such as:

$tabs = [
  ['status' => 'incoming', 'id' => 'nav-home', 'label' => 'nav-home-tab'],
  ['status' => 'in_progress', 'id' => 'nav-profile', 'label' => 'nav-profile-tab'],
  ['status' => 'ready', 'id' => 'nav-contact', 'label' => 'nav-contact-tab'],
];

and in your view:

@foreach($tabs as $tab)
    <div class="tab-pane fade show active" id="{{ $tab['id'] }}" role="tabpanel" aria-labelledby="{{ $tab['label'] }}">
        @include('dashboard.orders.includes.table_orders', ['status' => $tab['status']])
    </div>
@endforeach

Upvotes: 2

Roman Meyer
Roman Meyer

Reputation: 2872

As far I understood you, I would do something like this:

@include('dashboard.orders.includes.table_orders', ['status' => 'incoming'])

and then

@foreach($all_ as $element)
    @if($element->status === $status)
        ...
    @endif
@endforeach

If you want to output some data three times and the difference just in some variables, you won't break DRY principle.

Upvotes: 1

Lewis Hayter
Lewis Hayter

Reputation: 39

Try doing it like this @include('partial_name', $element)

Then you can access the variable as the name you passed to the include

Upvotes: 0

Related Questions