Skip to content

Simple Grid Actions

wdog edited this page Mar 12, 2018 · 2 revisions

Grid Actions

The purpose is to add 2 buttons to every grid line ( edit / delete )

  • Edit ( GET )
  • Delete ( DELETE )

Code

$provider = new EloquentDataProvider( Item::class );
$input = new InputSource( $_GET );

$grid = new Grid(
    $provider,
    [
        new TableCaption( 'Items' ),
        new Column( 'id' ),
        new Column( 'code' ),
        new Column( 'name' ),
        ( new Column( 'actions' ) )
            ->setValueCalculator( function ( $row ) {
                // edit   
                $edit = link_to_route( 'items.edit', 'Edit', $row->id, [ 'class' => 'btn btn-xs btn-info' ] );
                // delete
                $delete = link_to_route( 'items.destroy', 'Delete', $row->id, [
                     'class' => 'btn btn-xs btn-danger',
                     'data-method'  => "delete",
                     'data-confirm' => "Are you sure?"] );
                return $edit . " " . $delete;
            } ),
    ] );
    // grid style
    BootstrapStyling::applyTo( $grid );
    
    $grid = $grid->render();
    return view( 'items.index', compact( 'grid' ) );

in order to create manage the DELETE method we'll be using some javascript https://gist.github.com/soufianeEL/3f8483f0f3dc9e3ec5d9 with minor modifications ( TOKEN )

include this javascript code in your page

change

  var token = 
      $('<input>', {
        'type': 'hidden',
        'name': '_token',
        'value': link.data('token')
});

with

  var token = 
      $('<input>', {
        'type': 'hidden',
        'name': '_token',
        'value': window._token
});

and add to the head of your page ( HTML code )

<script>
    window._token = '{{ csrf_token() }}';
</script>
Clone this wiki locally