Don't use buttons in tables with full row select as this is confusing when clicking a button of a not selected row

This commit is contained in:
Bernd Bestel
2018-08-11 14:38:17 +02:00
parent ef043b38ce
commit c27f41aee4
2 changed files with 9 additions and 15 deletions

View File

@@ -1,9 +1,6 @@
var recipesTables = $('#recipes-table').DataTable({ var recipesTables = $('#recipes-table').DataTable({
'paginate': false, 'paginate': false,
'order': [[1, 'asc']], 'order': [[0, 'asc']],
'columnDefs': [
{ 'orderable': false, 'targets': 0 }
],
'language': JSON.parse(L('datatables_localization')), 'language': JSON.parse(L('datatables_localization')),
'scrollY': false, 'scrollY': false,
'colReorder': true, 'colReorder': true,
@@ -32,7 +29,7 @@ $("#search").on("keyup", function()
recipesTables.search(value).draw(); recipesTables.search(value).draw();
}); });
$(document).on('click', '.recipe-delete-button', function(e) $("#selectedRecipeDeleteButton").on('click', function(e)
{ {
var objectName = $(e.currentTarget).attr('data-recipe-name'); var objectName = $(e.currentTarget).attr('data-recipe-name');
var objectId = $(e.currentTarget).attr('data-recipe-id'); var objectId = $(e.currentTarget).attr('data-recipe-id');

View File

@@ -21,10 +21,9 @@
<label for="search">{{ $L('Search') }}</label> <i class="fas fa-search"></i> <label for="search">{{ $L('Search') }}</label> <i class="fas fa-search"></i>
<input type="text" class="form-control" id="search"> <input type="text" class="form-control" id="search">
<table id="recipes-table" class="table table-sm table-striped dt-responsive"> <table id="recipes-table" class="table table-striped dt-responsive">
<thead> <thead>
<tr> <tr>
<th>#</th>
<th>{{ $L('Name') }}</th> <th>{{ $L('Name') }}</th>
<th>{{ $L('Requirements fulfilled') }}</th> <th>{{ $L('Requirements fulfilled') }}</th>
</tr> </tr>
@@ -32,14 +31,6 @@
<tbody> <tbody>
@foreach($recipes as $recipe) @foreach($recipes as $recipe)
<tr data-recipe-id="{{ $recipe->id }}"> <tr data-recipe-id="{{ $recipe->id }}">
<td class="fit-content">
<a class="btn btn-sm btn-info" href="{{ $U('/recipe/') }}{{ $recipe->id }}">
<i class="fas fa-edit"></i>
</a>
<a class="btn btn-sm btn-danger recipe-delete-button" href="#" data-recipe-id="{{ $recipe->id }}" data-recipe-name="{{ $recipe->name }}">
<i class="fas fa-trash"></i>
</a>
</td>
<td> <td>
{{ $recipe->name }} {{ $recipe->name }}
</td> </td>
@@ -63,6 +54,12 @@
</a> </a>
<a class="btn btn-sm btn-outline-primary py-0 recipe-order-missing-button @if(FindObjectInArrayByPropertyValue($recipesSumFulfillment, 'recipe_id', $selectedRecipe->id)->need_fulfilled_with_shopping_list == 1){{ disabled }}@endif" href="#" data-toggle="tooltip" title="{{ $L('Put missing products on shopping list') }}" data-recipe-id="{{ $selectedRecipe->id }}" data-recipe-name="{{ $selectedRecipe->name }}"> <a class="btn btn-sm btn-outline-primary py-0 recipe-order-missing-button @if(FindObjectInArrayByPropertyValue($recipesSumFulfillment, 'recipe_id', $selectedRecipe->id)->need_fulfilled_with_shopping_list == 1){{ disabled }}@endif" href="#" data-toggle="tooltip" title="{{ $L('Put missing products on shopping list') }}" data-recipe-id="{{ $selectedRecipe->id }}" data-recipe-name="{{ $selectedRecipe->name }}">
<i class="fas fa-cart-plus"></i> <i class="fas fa-cart-plus"></i>
</a>&nbsp;&nbsp;
<a id="selectedRecipeEditButton" class="btn btn-sm btn-outline-info py-0" href="{{ $U('/recipe/') }}{{ $selectedRecipe->id }}">
<i class="fas fa-edit"></i>
</a>
<a id="selectedRecipeDeleteButton" class="btn btn-sm btn-outline-danger py-0" href="#" data-recipe-id="{{ $selectedRecipe->id }}" data-recipe-name="{{ $selectedRecipe->name }}">
<i class="fas fa-trash"></i>
</a> </a>
<a id="selectedRecipeToggleFullscreenButton" class="btn btn-sm btn-outline-secondary py-0 float-right" href="#" data-toggle="tooltip" title="{{ $L('Expand to fullscreen') }}"> <a id="selectedRecipeToggleFullscreenButton" class="btn btn-sm btn-outline-secondary py-0 float-right" href="#" data-toggle="tooltip" title="{{ $L('Expand to fullscreen') }}">
<i class="fas fa-expand-arrows-alt"></i> <i class="fas fa-expand-arrows-alt"></i>