Laravel 5 dataTables，初始化表与控制器功能

Question

我想创建一个dataTable的用户，其中每行有一个下拉子行包含用户权限的复选框。因此，非常动态的“超级”管理员可以点击用户并在表格中分配他们的权限。

首先，不确定这是否是一个好主意，所以请随时提出一个更好的方法。也许每行一个简单的弹出模式会更容易，但现在我已经认定这将是一个很酷的方式，所以我继续前进。

尝试使用AJAX初始化dataTable，但目前我难住了。

PermissionsController.php

public function grid() 
{ 
    //retrieve data from models 
    $data['data'] = collect([ 'admins' => $admins, 'roles' => $roles ]); 

     return $data; 
} 

routes.php文件

Route::get('user-permissions', '[email protected]'); 

permissions.blade

<table class="table table-striped" id="admins_table" > 
    <thead> 
    <tr> 
     <th>Last Name</th> 
     <th>First Name</th> 
     <th>Email</th> 
     <th>Phone</th> 
    </tr> 
    </thead> 
</table> 

JS

var oTable = $('#admins_table').dataTable({ 
    "sDom": "<'row'<'col-md-6'l><'col-md-6'f>r>t<'row'<'col-md-12'p i>>", 
    "aaSorting": [], 
    "oLanguage": { 
     "sLengthMenu": "_MENU_ ", 
     "sInfo": "Showing <b>_START_ to _END_</b> of _TOTAL_ entries" 
    }, 
    "ajax": { 
     //here's where I'm trying to grab the data 
     "url": "http://example.app/user-permissions", 
     "dataSrc": "data" 
    }, 
    "columns": [ 
     { "data": "last_name" }, 
     { "data": "first_name" }, 
     { "data": "email" }, 
     { "data": "phone" } 
    ] 
}); 

阿贾克斯

{ 
"data": 
    { 
    "admins": 
    [{ 
     "id":31, 
     "email":"[email protected]", 
     "last_login":"2015-07-27 09:50:50", 
     "first_name":"Gary", 
     "last_name":"Barlow", 
     "roles":[{ 
      "id":1,"slug":"admin" 
     }] 
    }], 

    "roles": 
    [ 
     {"id":3,"slug":"admin","name":"Admin"}, 
     {"id":7,"slug":"accounts","name":"Accounts"}, 
     {"id":8,"slug":"sales","name":"Sales"}, 
     {"id":9,"slug":"superAdmin","name":"SuperAdmin"} 
    ] 
    } 
} 

“管理” 对象包括所传递和他们已经分配的角色的所有管理员。这些应该显示为已在子行内打勾。 “角色”对象将包含所有可用于允许分配其他角色的当前角色。基本上，这确定了需要出现的复选框的数量。

由于上述内容与初始化有关，我已经将其余部分抽象出来。非常感谢任何帮助。

---

尝试使用AJAX我得到什么，但“没有在表中的可用数据”的时候，如果我在浏览器中键入路径路径我得到的JSON对象输出。

我不知道我应该如何调用路线。

url: '/user-permissions', 
dataSrc: 'data.admins', 
success: function (data) { 
    console.log(data); 
} 

以上就足够了吗？我真的不想打电话给整个网址。我甚至添加了一个成功函数来尝试获取数据的控制台输出，但仍然没有任何结果。

Answer 1

自从我问这个问题以来我已经有一段时间了，我想我会澄清我做了什么来解决问题。首先，我确保所有数据表脚本都是最新版本，不确定这是否是一个问题，但我正在使用一些过时的东西。

的表中初始化Ajax调用简直就成了：

ajax: "/user-permissions" 

大部分的辛勤工作进入被调用通过上述途径控制器功能：

public function grid() 
{ 
    $admins = // get users with relevant roles e.g. ($user->load('roles')) 

    return Datatables::of($admins)->make(true) 
} 

Answer 2

1. 正确dataSrc参考将data.admins
2. 你错过的样品数据admins[].phone？

据我了解，你想显示与data.roles一个<select>稀少，显示当前data.admins[].roles[0].id？

您可以通过在dataSrc回调收集data.roles做到这一点（或在xhr.dt事件），并使用render方法的角色列：

<table class="table table-striped" id="admins_table" > 
    <thead> 
    <tr> 
     <th>Last Name</th> 
     <th>First Name</th> 
     <th>Email</th> 
     <th>Phone</th> 
     <th>role</th> 
    </tr> 
    </thead> 
</table> 

JS，只有重要

var roles, 
var oTable = $('#admins_table').dataTable({ 
    "ajax": { 
     "url": "http://example.app/user-permissions", 
     "dataSrc" : function(json) { 
      roles = json.data.roles; 
      return json.data.admins; 
     } 
    }, 
    "columns": [ 
     { "data": "last_name" }, 
     { "data": "first_name" }, 
     { "data": "email" }, 
     { "data": "phone" }, 
     { "data": "roles", 
      "render": function(data, type, row) { 
      var select = '<select>', 
       role = data[0].id; 
      for (var i=0;i<roles.length;i++) { 
       select+='<option value="'+roles[i].id+'"'; 
       if (role == roles[i].id) select+=' selected'; 
       select+='>'+roles[i].name+'</option>'; 
      } 
      select+='</select>'; 
      return select; 
      } 
     } 
    ] 
}); 

生产此表：

与此数据：

{ "data": { 
    "admins": [{ 
     "id":31, 
     "email":"[email protected]", 
     "last_login":"2015-07-27 09:50:50", 
     "first_name":"Gary", 
     "last_name":"Barlow", 
     "phone" : "123", 
     "roles":[{ 
      "id":8,"slug":"sales" 
     }] 
    },{ 
     "id":32, 
     "email":"[email protected]", 
     "last_login":"2015-07-27 09:50:50", 
     "first_name":"Bary", 
     "last_name":"Garlow", 
     "phone" : "321", 
     "roles":[{ 
      "id":7,"slug":"accounts" 
     }] 
    }], 
    "roles": [ 
     {"id":3,"slug":"admin","name":"Admin"}, 
     {"id":7,"slug":"accounts","name":"Accounts"}, 
     {"id":8,"slug":"sales","name":"Sales"}, 
     {"id":9,"slug":"superAdmin","name":"SuperAdmin"} 
    ] 
    } 
}