Merge pull request #27 from webfactor/delete-button

tswonke · web-flow · commit 0918c6e4c53e · 2019-02-10T17:54:48.000+01:00
Delete button
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -21,6 +21,12 @@ Updates should follow the [Keep a CHANGELOG](http://keepachangelog.com/) princip
 ### Security
 - Nothing
 
+## 2.1.0 - 2019-02-10
+
+### Added
+- delete button!
+- edit/delete buttons will be disabled if no entry is selected
+
 ## 2.0.0 - 2019-02-08
 
 ### Added
diff --git a/README.md b/README.md
@@ -8,7 +8,7 @@
 [![Quality Score][ico-code-quality]][link-code-quality]
 [![Total Downloads][ico-downloads]][link-downloads]
 
-This is a package for [Laravel Backpack](https://laravel-backpack.readme.io/docs) and provides CRUD field types which allow to create and edit a related CRUD entity on-the-fly while adding/editing another.
+This is a package for [Laravel Backpack](https://laravel-backpack.readme.io/docs) and provides CRUD field types which allow to create and edit a related CRUD entity on-the-fly while adding/editing/deleting another.
 
 ![Screenshot](https://webfactor.de/files/modal_1.png)
 
@@ -58,9 +58,8 @@ CRUD::resource('entity', 'EntityCrudController')->with(function () {
 The trait/route will handle the following requests for you:
 
 - search on triggered entity
-- retrieve the HTML for the create and edit modal
-- store entity from modal
-- update entity from modal
+- retrieve the HTML for the create/edit/delete modal
+- store/update/destroy foreign entity
 
 ### Available Fields
 
@@ -69,7 +68,10 @@ There are two field types available in this package which allow you an instant c
 - [select2_from_ajax](https://laravel-backpack.readme.io/docs/crud-fields#section-select2_from_ajax)
 - [select2_from_ajax_multiple](https://laravel-backpack.readme.io/docs/crud-fields#section-select2_from_ajax_multiple)
 
-For `select2_from_ajax` also "edit" is available.
+> **Attention:**
+>
+> Edit and delete buttons are only available for  `select2_from_ajax`  
+> Please consider your database constraints when using the delete button!
 
 ### Field Definition
 
@@ -120,6 +122,7 @@ Example:
         
         'create'        => false
         'edit'          => false
+        'delete'        => false
         'create_modal'  => 'path to custom create modal'
         'edit_modal'    => 'path to custom edit modal'
         'attribute'     => '...' // see auto-fill below in readme
diff --git a/composer.json b/composer.json
@@ -1,7 +1,7 @@
 {
     "name": "webfactor/laravel-backpack-instant-fields",
     "type": "library",
-    "description": "Instant fields to create related entities on the fly in Laravel Backpack",
+    "description": "Instant fields to create/edit/delete related entities on the fly in Laravel Backpack",
     "keywords": [
         "webfactor",
         "laravel",
diff --git a/resources/views/fields/inc/button-delete.blade.php b/resources/views/fields/inc/button-delete.blade.php
@@ -0,0 +1,24 @@
+<span class="input-group-btn">
+    <button
+        href="#"
+        type="button"
+        class="btn btn-danger {{ $field['value'] ?: 'disabled'}}"
+        style="border-radius: 0px"
+        data-toggle="modal"
+        data-id="{{ $field['value'] ?? '' }}"
+        data-target="#{{ $field['on_the_fly']['entity'] ?? 'ajax_entity' }}_delete_modal"
+        data-load-url="{{ $field['on_the_fly']['delete_modal'] ?? backpack_url($field['on_the_fly']['entity']).'/ajax/delete?field_name='.$field['name'].'&attribute='.($field['on_the_fly']['attribute'] ?? 'name') }}">
+    <i class="fa fa-trash"></i>
+    </button>
+</span>
+<div class="modal fade"
+     id="{{ $field['on_the_fly']['entity'] ?? 'ajax_entity' }}_delete_modal"
+     tabindex="-1"
+     role="dialog"
+     aria-labelledby="{{ $field['on_the_fly']['entity'] ?? 'ajax_entity' }}_delete_modal"
+     aria-hidden="true">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content"></div>
+    </div>
+</div>
+
diff --git a/resources/views/fields/inc/button-edit.blade.php b/resources/views/fields/inc/button-edit.blade.php
@@ -2,7 +2,7 @@
     <button
         href="#"
         type="button"
-        class="btn btn-warning"
+        class="btn btn-warning {{ $field['value'] ?: 'disabled'}}"
         style="border-radius: 0px"
         data-toggle="modal"
         data-id="{{ $field['value'] ?? '' }}"
diff --git a/resources/views/fields/select2_from_ajax.blade.php b/resources/views/fields/select2_from_ajax.blade.php
@@ -45,6 +45,10 @@ class="form-control"
         @if ($field['on_the_fly']['edit'] ?? true)
             @include('webfactor::fields.inc.button-edit')
         @endif
+
+        @if ($field['on_the_fly']['delete'] ?? true)
+            @include('webfactor::fields.inc.button-delete')
+        @endif
     </div>
 
     {{-- HINT --}}
@@ -93,20 +97,42 @@ class="form-control"
             // load create modal content
             $("#{{ $field['on_the_fly']['entity'] ?? 'ajax_entity' }}_create_modal").on('show.bs.modal', function (e) {
                 var loadurl = $(e.relatedTarget).data('load-url');
+
                 $(this).find('.modal-content').load(loadurl);
             });
 
-            // load edit modal content
-            $("#{{ $field['on_the_fly']['entity'] ?? 'ajax_entity' }}_edit_modal").on('show.bs.modal', function (e) {
-                var loadurl = $(e.relatedTarget).data('load-url');
-                var id = $(e.relatedTarget).data('id');
-                $(this).find('.modal-content').load(loadurl + '&id=' + id);
+            // load edit/delete modal content
+            $(
+                "#{{ $field['on_the_fly']['entity'] ?? 'ajax_entity' }}_edit_modal," +
+                "#{{ $field['on_the_fly']['entity'] ?? 'ajax_entity' }}_delete_modal"
+            ).on('show.bs.modal', function (e) {
+                var button = e.relatedTarget;
+
+                if ($(button).hasClass('disabled')) {
+                    e.preventDefault();
+                    e.stopImmediatePropagation();
+                } else {
+                    var loadurl = $(button).data('load-url');
+                    var id = $(button).data('id');
+
+                    $(this).find('.modal-content').load(loadurl + '&id=' + id);
+                }
             });
 
-            // update id for edit modal url
+            // update id for edit/delete modal url
             $("#select2_ajax_{{ $field['name'] }}").change(function (e) {
-                $("[data-target='#{{ $field['on_the_fly']['entity'] ?? 'ajax_entity' }}_edit_modal']")
-                    .data("id", $("#select2_ajax_{{ $field['name'] }}").select2('data')[0].id);
+                var entry = $("#select2_ajax_{{ $field['name'] }}").select2('data')[0];
+                var editButton = $("[data-target='#{{ $field['on_the_fly']['entity'] ?? 'ajax_entity' }}_edit_modal']");
+                var deleteButton = $("[data-target='#{{ $field['on_the_fly']['entity'] ?? 'ajax_entity' }}_delete_modal']");
+
+                if (entry) {
+                    editButton.data("id", entry.id).removeClass('disabled');
+                    deleteButton.data("id", entry.id).removeClass('disabled');
+                } else {
+                    editButton.data("id", "").addClass('disabled');
+                    deleteButton.data("id", "").addClass('disabled');
+                }
+
             })
 
             // trigger select2 for each untriggered select2 box
@@ -170,11 +196,11 @@ class="form-control"
             });
 
             @if (isset($field['dependencies']))
-                @foreach (array_wrap($field['dependencies']) as $dependency)
-                    $('input[name={{ $dependency }}], select[name={{ $dependency }}], checkbox[name={{ $dependency }}], radio[name={{ $dependency }}], textarea[name={{ $dependency }}]').change(function () {
-                        $("#select2_ajax_{{ $field['name'] }}").val(null).trigger("change");
-                    });
-                @endforeach
+            @foreach (array_wrap($field['dependencies']) as $dependency)
+            $('input[name={{ $dependency }}], select[name={{ $dependency }}], checkbox[name={{ $dependency }}], radio[name={{ $dependency }}], textarea[name={{ $dependency }}]').change(function () {
+                $("#select2_ajax_{{ $field['name'] }}").val(null).trigger("change");
+            });
+            @endforeach
             @endif
         });
     </script>
diff --git a/resources/views/modal/delete.blade.php b/resources/views/modal/delete.blade.php
@@ -0,0 +1,57 @@
+@extends('webfactor::modal.delete_layout')
+
+@section('header')
+    <h3 class="box-title">{{ trans('backpack::crud.delete') }} {{ $crud->entity_name }}</h3>
+@endsection
+
+@section('content')
+    <div class="row">
+        <div class="col-md-10 col-md-offset-1">
+        @include('crud::inc.grouped_errors')
+
+            {{ trans('backpack::crud.delete_confirm') }}<br><br>
+
+            {{ $entry->{$attribute} }}
+
+        </div>
+    </div>
+@endsection
+
+@section('footer')
+    @include('webfactor::modal.inc.delete_form_buttons')
+@endsection
+
+@push('crud_fields_scripts')
+    <script>
+        $("#delete_{{ $entity }}").submit(function (e) {
+
+            $.ajax({
+                type: "DELETE",
+                url: "/{{ ltrim($crud->route . '/ajax', '/') }}",
+                data: { id: "{{ $id }}"},
+                success: function (data) {
+                    new PNotify({
+                        type: "success",
+                        title: "{{ trans('backpack::base.success') }}",
+                        text: "{{ trans('backpack::crud.delete_success') }}"
+                    });
+
+                    $("#{{ $entity }}_delete_modal").modal('hide');
+
+                    // Clear select
+                    $("#select2_ajax_{{ $field_name }}").val(null).trigger('change');
+                },
+                error: function (data) {
+                    new PNotify({
+                        type: "error",
+                        title: "{{ trans('backpack::base.error') }}",
+                        text: "{{ trans('backpack::base.error') }}: " + data.responseJSON
+                    });
+                }
+            });
+
+            e.preventDefault(); // avoid to execute the actual submit of the form.
+        });
+    </script>
+
+@endpush
diff --git a/resources/views/modal/delete_layout.blade.php b/resources/views/modal/delete_layout.blade.php
@@ -0,0 +1,18 @@
+@stack('crud_fields_styles')
+<form method="post" id="{{ 'delete_'.$entity }}" accept-charset="UTF-8">
+    {{ csrf_field() }}
+    <div class="modal-header">
+        <button type="button" class="close" data-toggle="modal" data-target="#{{ $entity }}_delete_modal" aria-label="Close">
+            <span aria-hidden="true">&times;</span>
+        </button>
+        @yield('header')
+    </div>
+    <div class="modal-body" id="modal-body">
+        @yield('content')
+    </div>
+
+    <div class="modal-footer">
+        @yield('footer')
+    </div>
+</form>
+@stack('crud_fields_scripts')
diff --git a/resources/views/modal/inc/delete_form_buttons.blade.php b/resources/views/modal/inc/delete_form_buttons.blade.php
@@ -0,0 +1,11 @@
+<div id="deleteActions" class="form-group">
+
+    <button type="submit" class="btn btn-danger">
+        <span class="fa fa-trash" role="presentation" aria-hidden="true"></span> &nbsp;
+        <span data-value="delete">{{ trans('backpack::crud.delete') }}</span>
+    </button>
+
+    <button class="btn btn-default" type="button" data-toggle="modal" data-target="#{{ $entity }}_delete_modal">
+        <span class="fa fa-ban"></span> {{ trans('backpack::crud.cancel') }}
+    </button>
+</div>
diff --git a/resources/views/modal/inc/edit_form_save_buttons.blade.php b/resources/views/modal/inc/edit_form_save_buttons.blade.php
@@ -1,7 +1,5 @@
 <div id="saveActions" class="form-group">
 
-    <input type="hidden" name="save_action" value="{{ $saveAction['active']['value'] }}">
-
     <button type="submit" class="btn btn-success">
         <span class="fa fa-save" role="presentation" aria-hidden="true"></span> &nbsp;
         <span data-value="save_and_back">{{ trans('backpack::crud.save') }}</span>
diff --git a/src/Traits/HandlesAjaxRequest.php b/src/Traits/HandlesAjaxRequest.php
@@ -24,6 +24,10 @@ public function handleAjaxRequest(Request $request, $mode = null)
             return $this->ajaxEdit();
         }
 
+        if ($mode == 'delete') {
+            return $this->ajaxDelete();
+        }
+
         if (strtolower($request->method()) == 'put') {
             return $this->ajaxStore($request);
         }
@@ -32,6 +36,10 @@ public function handleAjaxRequest(Request $request, $mode = null)
             return $this->ajaxUpdate($request);
         }
 
+        if (strtolower($request->method()) == 'delete') {
+            return $this->ajaxDestroy($request->input('id'));
+        }
+
         return $this->ajaxIndex($request);
     }
 
@@ -89,14 +97,33 @@ public function ajaxEdit()
             ->with('id', request()->input('id'))
             ->with('entity', $this->getAjaxEntity())
             ->with('crud', $this->crud)
-            ->with('saveAction', $this->getSaveAction())
             ->with('fields', $this->crud->getUpdateFields(request()->input('id')))
             ->with('title', trans('backpack::crud.add') . ' ' . $this->crud->entity_name)
             ->with('field_name', request()->input('field_name'))
             ->with('attribute', request()->input('attribute'))
             ->render();
     }
 
+    /**
+     * Returns the HTML that is used for displaying the on-the-fly modal of the deleting an entity
+     * @return string
+     */
+    public function ajaxDelete()
+    {
+        $this->crud->hasAccessOrFail('delete');
+
+        return \View::make('webfactor::modal.delete')
+            ->with('action', 'delete')
+            ->with('id', request()->input('id'))
+            ->with('entry', $this->crud->model::find(request()->input('id')))
+            ->with('entity', $this->getAjaxEntity())
+            ->with('crud', $this->crud)
+            ->with('title', trans('backpack::crud.add') . ' ' . $this->crud->entity_name)
+            ->with('field_name', request()->input('field_name'))
+            ->with('attribute', request()->input('attribute'))
+            ->render();
+    }
+
     /**
      * Checks permission and tries to store on-the-fly entity. If you want to enable request validation,
      * please set your StoreRequest class by using setAjaxStoreRequest() in your EntityCrudController
@@ -149,6 +176,27 @@ public function ajaxUpdate(Request $request)
         return $this->ajaxRespondError();
     }
 
+    /**
+     * Checks permission and tries to delete on-the-fly entity.
+     *
+     * @param int $id
+     * @return \Illuminate\Http\JsonResponse
+     */
+    public function ajaxDestroy(int $id)
+    {
+        if (!$this->crud->hasAccess('delete')) {
+            return $this->ajaxRespondNoPermission();
+        }
+
+        try {
+            $this->crud->delete($id);
+        } catch (\Exception $exception) {
+            return response()->json($this->ajaxFormatMessage($exception), 422);
+        }
+
+        return $this->ajaxRespondDeleted();
+    }
+
     /**
      * Validates the request and returns an error bag if it fails
      *
@@ -195,6 +243,16 @@ private function ajaxRespondUpdated()
         return response()->json([], 204);
     }
 
+    /**
+     * Responses 204 No Content
+     *
+     * @return \Illuminate\Http\JsonResponse
+     */
+    private function ajaxRespondDeleted()
+    {
+        return response()->json([], 204);
+    }
+
     /**
      * Responses 422 Error
      *
@@ -224,6 +282,10 @@ private function ajaxFormatMessage($message)
             return $validationErrors;
         }
 
+        if ($message instanceof \Exception) {
+            return $message->getMessage();
+        }
+
         return $message;
     }
 }

Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "webfactor/laravel-backpack-instant-fields",`
`3`	`3`	`"type": "library",`
`4`		`- "description": "Instant fields to create related entities on the fly in Laravel Backpack",`
	`4`	`+ "description": "Instant fields to create/edit/delete related entities on the fly in Laravel Backpack",`
`5`	`5`	`"keywords": [`
`6`	`6`	`"webfactor",`
`7`	`7`	`"laravel",`