Laravel-datatables: @component blade directive not rendered

Created on 16 May 2018  路  2Comments  路  Source: yajra/laravel-datatables

Summary of problem or feature request

Hi,
i am new to this "forum" and i have searched a lot but haven t found an answer.

Maybe i am not clever enough to understand your realy well written documentations and examples. Is it impossible to render blade directives. Especially the @component directive? I haven t found any hint about that.

My problem is: I have made some blade "partials" and combine them as a button group and i want to add this column to each row of the DataTable.

My code structure looks like this.

Code snippet of problem

view -> "components.listbar"

<div class="btn-toolbar float-right">
    <div class="btn-group " role="group" aria-label="List Toolbar">
        @if(!empty($showroute))
            @component('components.listToolbar.show',['showroute'=>$showroute,'item'=>$item])@endcomponent
        @endisset
        @if(!empty($editroute))
            @component('components.listToolbar.edit',['editroute'=>$editroute,'item'=>$item])@endcomponent
        @endisset
        @if(!empty($deleteroute))
            @component('components.listToolbar.delete',['deleteroute'=>$deleteroute,'item'=>$item,'itemtext'=>$itemtext])@endcomponent
        @endisset
        @isset($withswitch)
            @role('superadmin')
                <form action="{{ route('account.switch') }}" method="POST">
                    <input type="hidden" name="new_user_id" value="{{ $item->id }}">
                        {{ csrf_field() }}
                        <button type="submit" class="btn btn-danger">@svg('feather/refresh-ccw','feather-sm')</button>
                </form>                            
            @endrole
        @endisset
    </div>                                
</div>

this works fine in a blade template with foreach like this

<td class="align-middle p-0">  
    @component('components.listbar',[
        'item'=>$account,
         'itemtext'=>'der Account',
          'editroute'=>'accounts.edit',
          'showroute'=>'accounts.show',
           'deleteroute'=>'accounts.destroy',
            'withswitch'=>true
    ])
 @endcomponent
</td>

but in DataTables it is rendered as a string. Only the object is interpreted.

My datatables controller looks like this

<?php

namespace App\Http\Controllers\Backend;

use Illuminate\Http\Request;
use Yajra\DataTables\DataTables;
use App\Http\Controllers\Controller;
use App\Models\Account;

class DatatablesController extends Controller
{
    protected $accounts;

    public function __construct(\App\Repositories\AccountRepository $accounts) {
        $this->accounts = $accounts;
    }

    public function accountData(){

        $accounts=$this->accounts->getWithoutSuperadmin();

        return DataTables::of($accounts)
                ->addColumn('test',function($account){

                    return "@component('components.listbar',[ 
                                    'item'=>$account ,
                                    'itemtext'=>'der Account',
                                    'editroute'=>'accounts.edit',
                                    'showroute'=>'accounts.show',
                                    'deleteroute'=>'accounts.destroy',
                                    'withswitch'=>true
                                ])
                @endcomponent";

                })
                ->rawColumns(['test'])
                ->make(true);
    }
}

and my ajax-blade like this

@extends('layouts.app')

@section('content')

    <div class="card">
        @component('components.cardheader',
            ['backroute'=>'backend',
            'createroute'=>'accounts.create',
            'title'=>$title])
        @endcomponent

        <div class="card-body">
             <table class="table table-striped table-hover table-borderless" id="accounts-table">
                <thead>
                    <tr>
                        <th>Account ID</th>
                        <th>Username</th>
                        <th>Name</th>
                        <th>Email</th>         
                        <th>Phone</th> 
                        <th>test</th> 

                    </tr>
                </thead>

            </table>


        </div>
    </div>

@stop
@push('script')
<script>

    $('#accounts-table').DataTable({
        processing: true,
        serverSide: true,
        ajax: '{!! route('datatables.accounts') !!}',
        columns: [
            { data: 'id', name: 'id' },
            { data: 'username', name: 'username' },
            { data: 'name', name: 'name' },
            { data: 'email', name: 'email' },
            { data: 'phone', name: 'phone' },
            { data: 'test', name: 'test', orderable: false, searchable: false },

        ]
    });

</script>
@endpush

everything else is working fine. And it is rendering html tags like h1 without problems.

Is it impossible to use blade directives like this or am i just dumb?

System details

  • Operating System -> windows 7
  • PHP Version -> 7
  • Laravel Version -> 5.6
  • Laravel-Datatables Version -> "yajra/laravel-datatables-oracle": "~8.0"

Sorry for this monstrous post but my english is not good enough to discribe it with words only

Regards M枚bius

question

Most helpful comment

I think you're calling the view incorrectly? Try something like:

        return DataTables::of($accounts)
                ->addColumn('test',function($account){

                    return view('components.listbar',[ 
                                    'item'=>$account ,
                                    'itemtext'=>'der Account',
                                    'editroute'=>'accounts.edit',
                                    'showroute'=>'accounts.show',
                                    'deleteroute'=>'accounts.destroy',
                                    'withswitch'=>true
                                ]);

                })
                ->rawColumns(['test'])
                ->make(true);

All 2 comments

I think you're calling the view incorrectly? Try something like:

        return DataTables::of($accounts)
                ->addColumn('test',function($account){

                    return view('components.listbar',[ 
                                    'item'=>$account ,
                                    'itemtext'=>'der Account',
                                    'editroute'=>'accounts.edit',
                                    'showroute'=>'accounts.show',
                                    'deleteroute'=>'accounts.destroy',
                                    'withswitch'=>true
                                ]);

                })
                ->rawColumns(['test'])
                ->make(true);

That works perfect. Thank you very much. That was a blazing fast answer. Really appreciate your support.

Regards M枚bius

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jackrsantana picture jackrsantana  路  3Comments

hohuuhau picture hohuuhau  路  3Comments

shadoWalker89 picture shadoWalker89  路  3Comments

nasirkhan picture nasirkhan  路  3Comments

kamrava picture kamrava  路  3Comments