如何使用 yajra(Laravel) 使用两个或多个 DataTables

Question

我的数据库中有“发布”表。在 post 表中，我有“LanguageID”列。 当我存储/保存数据时，它会创建两条记录，第一条语言 id = 1 的记录，第二条语言 id = 2 的记录。 现在，我想分别显示所有“发布”数据。

控制器

public function index(Request $request)
{
    $languages = Language::where('IsActive', 1)->get();
    if($request->ajax()) {  
        foreach ($languages as $lang) {
            $post = Post::where('LanguageID', $lang->id)->get();
        }
        return Datatables::of($post)
        ->addColumn('action', function($post){
            return '<a id="edit" class="btn btn-info" 
                                 href="post/' . $post->id . '/edit">
                                    <i class="glyphicon glyphicon-edit icon-white"></i>
                                    Edit
                                </a>
                                <button type="button" class="btn btn-danger"
                                 onclick="checkDelete('.$post->id.', this);" 
                                 data-token="{{ csrf_token() }}">
                                    <i class="glyphicon glyphicon-trash icon-white"></i>
                                    Delete
                                </button>';
                            })
        ->make(true);
    } 
    return view('pages.back-end.lists.post')->with('languages', $languages);  
}

这是我的看法

这是我的亚吉拉

$(function(){
$("#data-post").DataTable({
  processing: true,
  serverSide: true,
  ajax:{
             url: "{{ url("post") }}",
             data:{ _token: "{{csrf_token()}}", languageid: languageid}

       },
  columns: [
      { data: 'PostDate', name: 'PostDate'},
      { data: 'PostTitle', name: 'PostTitle' },
      { data: 'PostSlug', name: 'PostTitle' },
      { data: 'action', name: 'action'}
  ]
});

});

Answer 1

您可以使用基于语言 id 的 yajra 数据表过滤器参考这个 - https://datatables.yajrabox.com/collection/custom-filter

或

使用可以通过传递语言 id 对按钮印度尼西亚和英语进行手动 ajax 调用，然后像这样销毁和重新启动数据表 -

function customFilters(languageid)
{ 
    $('#datatableid').dataTable().fnDestroy();
    $('#datatableid').DataTable({
        "processing": true,
        "serverSide": true,
        "ajax":{
                 "url": url_link,
                 "dataType": "json",
                 "type": "POST",
                 "data":{ _token: "{{csrf_token()}}", languageid: languageid}     
           },
     "columns": [
        { "data": "id" },
        { "data": "PostDate" },
        { "data": "PostTitle" },
        { "data": "PostSlug"},
        { "data": "LanguageID"},
        { "data": "actions" ,orderable: false, searchable: false}
      ]    
   });
}

希望这会对你有所帮助。

Answer 2

您必须在 dataTable.php 中像这样解析语言 ID

public function language($id){
    $this->language = $id;
    return $this;
}

public function query(Post $model)
{
    $query = Post::where('LanguageID',$this->language)->select('posts.*');

    return $this->applyScopes($query);
}

然后，手动调用dataTable

$('.tabPost').each(function(){
var lang_id = $(this).attr('id');
var oTable = $("#data-post" + lang_id).DataTable({
  processing: true,
  serverSide: true,
  dom: 'Bfrtip',
  order: [[0, 'desc']],
  buttons: ['create',
            'export',
            'print',
            'reset',
            'reload',
            'colvis',
           ],
  ajax:{
    url: "{{ url("post") }}",
    data: function(d) {
      d.LanguageID = lang_id
    }
  },
  columns: [
      { data: 'id', name: 'id'},
      { data: 'PostDate', name: 'PostDate'},
      { data: 'PostTitle', name: 'PostTitle' },
      { data: 'PostSlug', name: 'PostTitle' },
      { data: 'action', name: 'action'}
  ]
});

$('#'+lang_id).on('click', function(e){
  oTable.draw();
  e.preventDefault();
});

  }); 

别忘了这样设置你的控制器

public function index(PostDataTable $dataTable, Request $request)
{
    $languages = Language::where('IsActive', 1)->get();
    return $dataTable->language($request->input('LanguageID'))->render('pages.back-end.lists.post', compact('languages'));
}