Fix/Workaround for DataTables ColReorder bug with data-order attributes (fixes #2019)

This commit is contained in:
Bernd Bestel 2022-11-12 18:10:32 +01:00
parent 88950f00d5
commit 6036786153
No known key found for this signature in database
GPG Key ID: 71BD34C0D4891300
7 changed files with 33 additions and 17 deletions

View File

@ -895,6 +895,18 @@ $(document).on("click", "tr.dtrg-group", function()
collapsedGroups[name] = !collapsedGroups[name];
$("table").DataTable().draw();
});
$.fn.dataTable.ext.type.order["custom-sort-pre"] = function(data)
{
// Workaround for https://github.com/DataTables/ColReorder/issues/85
//
// Custom sorting can normally be provided by a "data-order" attribute on the <td> element,
// however this causes issues when reordering such a column...
//
// This here is for a custom column type "custom-sort",
// the custom order value needs to be provided in the first child (<span>) of the <td>
return (parseFloat($(data).get(0).innerText));
};
// serializeJSON defaults
$.serializeJSON.defaultOptions.checkboxUncheckedValue = "0";

View File

@ -9,7 +9,7 @@ var shoppingListTable = $('#shoppinglist-table').DataTable({
{ 'visible': false, 'targets': 6 },
{ 'visible': false, 'targets': 7 },
{ 'visible': false, 'targets': 8 },
{ "type": "num", "targets": 2 },
{ "type": "custom-sort", "targets": 2 },
{ "type": "html-num-fmt", "targets": 5 },
{ "type": "html-num-fmt", "targets": 6 }
].concat($.fn.dataTable.defaults.columnDefs),

View File

@ -5,9 +5,9 @@
{ 'searchable': false, "targets": 0 },
{ 'visible': false, 'targets': 10 },
{ "type": "num", "targets": 1 },
{ "type": "num", "targets": 3 },
{ "type": "custom-sort", "targets": 3 },
{ "type": "html", "targets": 4 },
{ "type": "html-num-fmt", "targets": 7 },
{ "type": "custom-sort", "targets": 7 },
{ "type": "html", "targets": 8 },
{ "type": "html", "targets": 9 }
].concat($.fn.dataTable.defaults.columnDefs)

View File

@ -1,4 +1,6 @@
var stockOverviewTable = $('#stock-overview-table').DataTable({

var stockOverviewTable = $('#stock-overview-table').DataTable({
'order': [[5, 'asc']],
'columnDefs': [
{ 'orderable': false, 'targets': 0 },
@ -19,15 +21,15 @@
{ 'visible': false, 'targets': 16 },
{ 'visible': false, 'targets': 17 },
{ 'visible': false, 'targets': 18 },
{ "type": "num", "targets": 3 },
{ "type": "custom-sort", "targets": 3 },
{ "type": "html-num-fmt", "targets": 9 },
{ "type": "html-num-fmt", "targets": 10 },
{ "type": "html", "targets": 5 },
{ "type": "html", "targets": 11 },
{ "type": "html-num-fmt", "targets": 12 },
{ "type": "custom-sort", "targets": 12 },
{ "type": "num", "targets": 13 },
{ "type": "html-num-fmt", "targets": 4 },
{ "type": "html-num-fmt", "targets": 18 }
{ "type": "custom-sort", "targets": 18 }
].concat($.fn.dataTable.defaults.columnDefs)
});

View File

@ -243,8 +243,8 @@
}
@endphp
@endif
<td data-order={{
$listItem->amount }}>
<td>
<span class="custom-sort d-none">{{$listItem->amount}}</span>
<span class="locale-number locale-number-quantity-amount">{{ $listItem->amount }}</span> @if(!empty($listItem->product_id)){{ $__n($listItem->amount, $listItem->qu_name, $listItem->qu_name_plural, true) }}@endif
</td>
<td>

View File

@ -255,7 +255,8 @@
data-product-id="{{ $stockEntry->product_id }}">
{{ FindObjectInArrayByPropertyValue($products, 'id', $stockEntry->product_id)->name }}
</td>
<td data-order="{{ $stockEntry->amount }}">
<td>
<span class="custom-sort d-none">{{$stockEntry->amount}}</span>
<span id="stock-{{ $stockEntry->id }}-amount"
class="locale-number locale-number-quantity-amount">{{ $stockEntry->amount }}</span> <span id="product-{{ $stockEntry->product_id }}-qu-name">{{ $__n($stockEntry->amount, FindObjectInArrayByPropertyValue($quantityunits, 'id', FindObjectInArrayByPropertyValue($products, 'id', $stockEntry->product_id)->qu_id_stock)->name, FindObjectInArrayByPropertyValue($quantityunits, 'id', FindObjectInArrayByPropertyValue($products, 'id', $stockEntry->product_id)->qu_id_stock)->name_plural, true) }}</span>
<span id="stock-{{ $stockEntry->id }}-opened-amount"
@ -279,8 +280,8 @@
{{ FindObjectInArrayByPropertyValue($shoppinglocations, 'id', $stockEntry->shopping_location_id)->name }}
@endif
</td>
<td data-order="{{$stockEntry->price}}"
class="@if(!GROCY_FEATURE_FLAG_STOCK_PRICE_TRACKING) d-none @endif">
<td class="@if(!GROCY_FEATURE_FLAG_STOCK_PRICE_TRACKING) d-none @endif">
<span class="custom-sort d-none">{{$stockEntry->price}}</span>
<span id="stock-{{ $stockEntry->id }}-price"
data-toggle="tooltip"
data-trigger="hover click"

View File

@ -322,7 +322,8 @@
<td>
@if($currentStockEntry->product_group_name !== null){{ $currentStockEntry->product_group_name }}@endif
</td>
<td data-order="@if($currentStockEntry->product_no_own_stock == 1){{ $currentStockEntry->amount_aggregated }}@else{{ $currentStockEntry->amount }}@endif">
<td>
<span class="custom-sort d-none">@if($currentStockEntry->product_no_own_stock == 1){{ $currentStockEntry->amount_aggregated }}@else{{ $currentStockEntry->amount }}@endif</span>
<span class="@if($currentStockEntry->product_no_own_stock == 1) d-none @endif">
<span id="product-{{ $currentStockEntry->product_id }}-amount"
class="locale-number locale-number-quantity-amount">{{ $currentStockEntry->amount }}</span> <span id="product-{{ $currentStockEntry->product_id }}-qu-name">{{ $__n($currentStockEntry->amount, $currentStockEntry->qu_unit_name, $currentStockEntry->qu_unit_name_plural) }}</span>
@ -400,8 +401,8 @@
<time class="timeago timeago-contextual"
datetime="{{ $currentStockEntry->last_purchased }}"></time>
</td>
<td data-order="{{$currentStockEntry->last_price}}"
class="@if(!GROCY_FEATURE_FLAG_STOCK_PRICE_TRACKING) d-none @endif">
<td class="@if(!GROCY_FEATURE_FLAG_STOCK_PRICE_TRACKING) d-none @endif">
<span class="custom-sort d-none">{{$currentStockEntry->last_price}}</span>
@if(!empty($currentStockEntry->last_price))
<span data-toggle="tooltip"
data-trigger="hover click"
@ -430,8 +431,8 @@
class="lazy">
@endif
</td>
<td data-order="{{$currentStockEntry->average_price}}"
class="@if(!GROCY_FEATURE_FLAG_STOCK_PRICE_TRACKING) d-none @endif">
<td class="@if(!GROCY_FEATURE_FLAG_STOCK_PRICE_TRACKING) d-none @endif">
<span class="custom-sort d-none">{{$currentStockEntry->average_price}}</span>
@if(!empty($currentStockEntry->average_price))
<span data-toggle="tooltip"
data-trigger="hover click"