Question

我正在尝试创建一个用户数据表，其中每行都有一个包含用户权限复选框的下拉子行。非常动态的超级＆＃39;管理员可以点击用户并在表格中分配他们的权限。

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

尝试用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', 'PermissionsController@grid');

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" }
    ]
});

的Ajax

{
"data":
    {
    "admins":
    [{
        "id":31,
        "email":"example@gmail.com",
        "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"}
    ]
    }
}

＆＃34; admin＆＃34; object包含所有传递的管理员及其已分配的角色。这些应该显示为已在子行中勾选。＆＃34;角色＆＃34;对象将包含可用于分配其他角色的所有当前角色。基本上，这标识了需要出现的复选框的数量。

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

尝试使用AJAX我什么也得不到，而且＃34;表格中没有可用的数据＆＃34;如果我在浏览器中键入路径路径，我将获得JSON对象输出。

我不确定如何拨打这条路线。

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

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

Answer 1

正确的dataSrc引用将为data.admins
您错过了示例数据中的admins[].phone？

据我了解，您希望显示填充<select>的{{1}}，显示当前的data.roles？

您可以通过收集data.admins[].roles[0].id回调（或data.roles事件）中的dataSrc并对角色列使用xhr.dt方法来执行此操作：

render

js，只有重要的

<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>

生成此表：

有这些数据：

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;
          }
       }
    ]
});

Answer 2

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

在表格初始化中，ajax调用变得简单：

ajax: "/user-permissions"

大部分努力都进入了上述路线调用的控制器功能：

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

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

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

2 个答案: