@extends('adminlte::page')
@section('title', 'Veure inscripcions a la sessió informativa de {{ App\Helpers\helpers::getdatehorarisinformativahelper($sinformativa->datetime) }}')
@section('content_header')
<i class="fa fa-users" aria-hidden="true"></i> Veure inscripcions a la sessió informativa de {{ App\Helpers\helpers::getdatehorarisinformativahelper($sinformativa->datetime) }}
@endsection
@section('breadcrumb')
<ol class="breadcrumb">
	<li class="breadcrumb-item"><a href="{{ route('admin.home') }}">Home</a></li>
	<li class="breadcrumb-item"><a href="{{ route('sinformativas.index') }}">Sessions informatives</a></li>
	<li class="breadcrumb-item">Veure inscripcions a la sessió informativa</a></li>
</ol>
@endsection
@section('css')
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/3.2.5/css/buttons.dataTables.min.css">

<script src="https://cdn.datatables.net/buttons/3.2.5/js/dataTables.buttons.js"></script>
<script src="https://cdn.datatables.net/buttons/3.2.5/js/buttons.dataTables.js"></script>
<script src="https://cdn.datatables.net/buttons/3.2.5/js/buttons.print.min.js"></script>
@endsection

@section('content')

<div class="row tablabordersaccount" id="accountinfo">
        
          <div class="col-md-6">
          <table class="table table-striped table-bordered" id="tablausers">
            <thead>
              <th>ID</th>
              <th>Nom</th>
            </thead>
          <tbody>
           
          @foreach ($inscriptionssi as $inscriptionsi)
          <tr>
            <td>{{$inscriptionsi->id}}</td>
            <td>{{$inscriptionsi->user->name}} {{$inscriptionsi->user->cognom1}} {{$inscriptionsi->user->cognom2}}</td>
          </tr>
          @endforeach
              
          </tbody>
          </table>
          </div>
        </div>

@endsection

@section('js')

<script>
$(document).ready(function() {
    //$.fn.dataTable.ext.search.pop(); -> posible reset

    var oTable = $('#tablausers').DataTable( {
      layout: {
        topStart: {
            buttons: ['print']
        }
    },
        "order": [[ 0, "desc" ]],
        responsive : true,
      "language": {
                search: "",
                emptyTable: "No hi ha sessions informatives",
                zeroRecords: "No hi ha sessions informatives per aquesta cerca",
                lengthMenu: "Mostrar _MENU_ sessions informatives",
                info: "Mostrant _START_ a _END_ de _TOTAL_ sessions informatives",
                infoEmpty: "No hi ha sessions informatives",
                infoFiltered:   "(filtrat de _MAX_ sessions informatives en total)",
                searchPlaceholder: "Buscar...",
                selectPlaceholder: "Buscar...",
                paginate: {
            first:      "Primer",
            previous:   "Anterior",
            next:       "Següent",
            last:       "Últim"
        },
            },
       "dom": '<"datatablesalunos"f><l<t>ip>',
      "columnDefs": [ {
            "searchable": false,
            "orderable": false,
            "targets": [],
        } ],

        initComplete: function () {
    
 
      // Remove accented character from search input as well
      $('#tablausers_filter input').keyup( function () {
        oTable
          .search(
            jQuery.fn.DataTable.ext.type.search.string( this.value )
          )
          .draw()
      } );
      //end remove special characters

            this.api().columns('.select-filter').every( function () {
                var column = this;
                var th = $("#tablausers").find("th").eq(column.index());
                var select = $('<select class="form-control"><option value="">' + 'Filtrar ' + th.text() + '</option></select>')
                    //.appendTo( $(column.footer()).empty() )
                    .appendTo( $('.datatablesalunos'))
                    .on( 'change', function () {
                        var val = $.fn.dataTable.util.escapeRegex(
                            $(this).val()
                        );
            
                        column
                            .search( val ? '^'+val+'$' : '', true, false )
                            .draw();
                    } );
 
                column.data().unique().sort().each( function ( d, j ) {
                    select.append( '<option value="'+d+'">'+d+'</option>' )
                } );
            } );
        }
    }  );
} );

</script>

@endsection