Populate Select2 With Data Attributes HTML5 values Laravel Collective

I'm having trouble populating a Select2 Multiple Values field with data from a Data Attributes, the fields like Name and description etc are being filled in, just the Select not !!

WhenIclicktheeditbuttonIwouldliketogetthedatatofilltheselect2fieldinamodal

Seethattheotherfieldshavebeenfilledinwiththedataattributesoftheeditbutton!

HTMLLARAVELCOLLECTIVE

<divclass="row">
                                <div class="col-md-12">
                                    <div class="">
                                        {{ Form::label('permission', 'Permissões') }}
                                        {{ Form::select('permission[]', $permissions, null, ['class' => ' permission-id-multiple-select vai', 'multiple' => 'multiple']) }}
                                    </div>
                                </div>
                            </div>

DATABASE JAVASCRIPT

$('#lista-roles').DataTable( {
    processing: true,
    serverSide: true,
    ajax: '/controleAcesso/roles/listar-ajax',
    columns: [
        { data: 'name', name: 'roles.name'},
        { data: 'display_name', name: 'roles.display_name'},
        { data: 'description', name: 'roles.description' },
        { data: 'permissions', name: 'permissions.name' },
        {
            //"aTargets": [ 3 ], // o numero 6 é o nº da coluna
            "mRender": function ( data, type, row ) { //aqui é uma funçãozinha para pegar os ids
                return '<button type="button" class="btn btn-success btnUpdateRole" ' +
                    '   data-name="' + row.name + '"' +
                    '   data-display_name="' + row.display_name + '"' +
                    '   data-description="' + row.description + '"' +
                    '   data-id="' + row.id+ '"' +
                    '   data-permission="' + row.permissions+ '"' +
                    '    >' +
                    '       <span class="fa fa-edit"> </span>' +
                    '   </button>' +
                    '   <button type="button" class="btn btn-danger btnDelRole" data-id="' + row.id +'"> '+
                    '       <span class="fa fa-trash"></span> ' +
                    '   </button> ';
            }
        }
    ],
    "language": {
        "url": "https://cdn.datatables.net/plug-ins/1.10.12/i18n/Portuguese-Brasil.json"
    }
});

UPDATE BUTTON JAVASCRIPT

$(document).on('click', '.btnUpdateRole', function() {
    $('.name').val($(this).data('name'));
    $('.display_name').val($(this).data('display_name'));
    $('.description').val($(this).data('description'));
    $('.id').val($(this).data('id'));
    $('.vai').val($(this).data('permission'));
    alert($(this).data('permission'));
    $('#modalUpdateRole').modal('show');
});

CONTROLLER

public function listarajax(Request $request){
    if ($request->ajax()) {
        $query = Role::with('permissions')->selectRaw('distinct roles.*');

        return Datatables()->eloquent($query)
            ->addColumn('permissions', function (Role $role) {
                return $role->permissions->map(function($permissions) {
                    return str_limit($permissions->display_name, 30, '...');
                    //return $permissions->id;
                })->implode(', ');
            })->make(true);

    }
}

PS: IF SOMEONE HAD A BETTER SHAPE, A WAY TO BRING MODAL BY AJAX THAT I ALREADY TRIED TO LOAD MODAL BY AJAX AND I COULD NOT COMPLETE DATA WITH SELECT AND NOT WITH DATA ATTRIBUTES / p>