如何在yajra数据表中添加操作列

问题描述

我坚持使用yajra数据表添加用于编辑和删除按钮的列操作，我使用DataTables Service，因为我也想添加导出按钮，这是我的数据表代码：

public function dataTable($query)
{
    return datatables()
        ->eloquent($query);
}

/**
 * Get query source of dataTable.
 *
 * @param \App\InfoDataTable $model
 * @return \Illuminate\Database\Eloquent\Builder
 */
public function query(InfoDataTable $model)
{
    // return $model->newQuery();
    $data = DataInfo::select('data-info.*');
    return $this->applyScopes($data);
}

/**
 * Optional method if you want to use html builder.
 *
 * @return \Yajra\DataTables\Html\Builder
 */


public function html()
{
  return $this->builder()
             ->columns($this->getColumns())
             ->addAction()
             ->parameters([
                 'dom' => 'Bfrtip','buttons' => ['csv','excel','print'],]);
}

/**
 * Get columns.
 *
 * @return array
 */
protected function getColumns()
{
    return [
        Column::make('employee_no'),Column::make('name'),Column::make('address'),Column::make('birthplace'),Column::make('birthdate'),Column::make('age'),Column::make('occupation'),Column::make('status'),Column::make('gender'),Column::make('startdate'),];
}

这是我在控制器中用于呈现表格的代码

public function index(InfoDataTable $dataTable)
{
          $User = User::where('id',Auth::id())->first();
          if($User->role == 'superadmin'){
          return $dataTable->render('superadmin.index');
            } else {
              return $dataTable->render('admin.index');
            }
 }

我的刀片看起来像这样

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row justify-content-center">
            <div class="card">
                <div class="card-header">Dashboard</div>
                <div class="card-body">
                    @if (session('status'))
                        <div class="alert alert-success" role="alert">
                            {{ session('status') }}
                        </div>
                    @endif
                </div>
            <div class="card-body">
              <div class="table-responsive">
                <div class="panel panel-default">
                {{(!! $dataTable->table() !!)}}
              </div>
            </div>
            </div>
          </div>
        </div>
</div>
@stop
@push('scripts')
  {!! $dataTable->scripts() !!}
@endpush

my current view looks like this

有什么建议吗？对不起，我的英语不好，尝试了许多教程，但找不到正确的教程

解决方法

“动作”列是yajra数据表的默认列。因此，我找到了如何删除它：https://yajrabox.com/docs/laravel-datatables/6.0/remove-column（我从未尝试过）

public function dataTable($query)
{
    return datatables()
        ->eloquent($query)
        ->removeColumn('action');
}

如果要编辑操作列，请尝试输入我的代码：

public function dataTable($query)
{
    $dataTable = new EloquentDataTable($query);

    return $dataTable->addColumn('action','folderNameInViewfolder.datatables_actions');
}

这就是datatables_actions（全名：datatables_actions.blade.php）中的内容

{!! Form::open(['route' => ['routename.destroy',$id],'method' => 'delete']) !!}
<div class='btn-group'>
    <a href="{{ route('routename.show',$id) }}" class='btn btn-default btn-xs'>
        <i class="glyphicon glyphicon-eye-open"></i>
    </a>
    <a href="{{ route('routename.edit',$id) }}" class='btn btn-default btn-xs'>
        <i class="glyphicon glyphicon-edit"></i>
    </a>
    {!! Form::button('<i class="glyphicon glyphicon-trash"></i>',[
        'type' => 'submit','class' => 'btn btn-danger btn-xs','onclick' => "return confirm('Are you sure?')"
    ]) !!}
</div>
{!! Form::close() !!}

我的代码与您的代码不同，所以我将显示我的代码：

数据表代码：

public function dataTable($query)
    {
        $dataTable = new EloquentDataTable($query);

        return $dataTable->addColumn('action','cachthuclamviecs.datatables_actions');
    }

    /**
     * Get query source of dataTable.
     *
     * @param \App\Models\Cachthuclamviec $model
     * @return \Illuminate\Database\Eloquent\Builder
     */
    public function query(Cachthuclamviec $model)
    {
        return $model->newQuery();
    }

    /**
     * Optional method if you want to use html builder.
     *
     * @return \Yajra\DataTables\Html\Builder
     */
    public function html()
    {
        return $this->builder()
            ->columns($this->getColumns())
            ->minifiedAjax()
            ->addAction(['width' => '120px','printable' => false])
            ->parameters([
                'dom'       => 'Bfrtip','stateSave' => true,'order'     => [[0,'desc']],'buttons'   => [
                    ['extend' => 'create','className' => 'btn btn-default btn-sm no-corner','text' => '<span><i class="fa fa-plus"></i> Thêm</span>'],['extend' => 'export','text' => '<span><i class="fa fa-download"></i> Xuất&nbsp;<span class="caret"></span></span>'],['extend' => 'print','text' => '<span><i class="fa fa-print"></i> In</span>'],['extend' => 'reset','text' => '<span><i class="fa fa-undo"></i> Cài lại</span>'],['extend' => 'reload','text' => '<span><i class="fa fa-refresh"></i> Tải lại</span>'],],]);
    }

    /**
     * Get columns.
     *
     * @return array
     */
    protected function getColumns()
    {
        return [
            'cachthuclamviec'
        ];
    }

控制器代码：

public function index(CachthuclamviecDataTable $cachthuclamviecDataTable)
{
    return $cachthuclamviecDataTable->render('cachthuclamviecs.index');
}

刀片代码：

@section('css')
    @include('layouts.datatables_css')
@endsection

{!! $dataTable->table(['width' => '100%','class' => 'table table-striped table-bordered']) !!}

@push('scripts')
    @include('layouts.datatables_js')
    {!! $dataTable->scripts() !!}
@endpush

datatables_actions刀片服务器代码：

{!! Form::open(['route' => ['cachthuclamviecs.destroy','method' => 'delete']) !!}
<div class='btn-group'>
    <a href="{{ route('cachthuclamviecs.show',$id) }}" class='btn btn-default btn-xs'>
        <i class="glyphicon glyphicon-eye-open"></i>
    </a>
    <a href="{{ route('cachthuclamviecs.edit','onclick' => "return confirm('Are you sure?')"
    ]) !!}
</div>
{!! Form::close() !!}

将文件datatables_actions放在此处：datatables_actions：

由于Boostrap，jQuery，...版本，代码可能有所不同