fixed pro rate sorting

resources/views/admin/pros_SINGLE/SUB_pro_rates.blade.php

@@ -1,38 +1,41 @@
+<?php /* DO NOT GENERATE */ ?>
 @extends('admin.pros.view')
 @section('content-inner')
 
-    <div class="pb-3">
+<div class="pb-3">
 
-        <h5 class='my-3 d-flex stag-heading stag-heading-sub'>
-            <div>Pro Rates</div>
-            <div class="ml-auto">
-                <a class="btn btn-primary btn-sm ml-2" up-modal=".form-contents" up-preload up-delay="25" up-width="800" up-history="false" href="{{route('pros_SINGLE-ACTION_add_new_pro_rate', ['uid' => $record->uid])}}?optimised=1"><i class='fa fa-plus-circle' aria-hidden='true'></i> Add New</a>
-            </div>
-        </h5>
+    <h5 class='my-3 d-flex stag-heading stag-heading-sub'>
+        <div>Pro Rates</div>
+        <div class="ml-auto">
+            <a class="btn btn-primary btn-sm ml-2" up-modal=".form-contents" up-preload up-delay="25" up-width="800" up-history="false" href="{{route('pros_SINGLE-ACTION_add_new_pro_rate', ['uid' => $record->uid])}}?optimised=1"><i class='fa fa-plus-circle' aria-hidden='true'></i> Add New</a>
+        </div>
+    </h5>
 
-        <div class="table-responsive p-0 bg-white border stag-table stag-table-sub">
-            <table class="table table-hover text-nowrap">
-                <thead>
+    <div class="table-responsive p-0 bg-white border stag-table stag-table-sub">
+        <table class="table table-hover text-nowrap">
+            <thead>
                 <tr>
                     <th>&nbsp;</th>
-<th>Responsibility</th>
-<th>Code</th>
-<th>Amount</th>
+                    <th>Responsibility</th>
+                    <th>Code</th>
+                    <th>Amount</th>
+                    <th></th>
                 </tr>
-                </thead>
-                <tbody>
+            </thead>
+            <tbody class="sortable" data-url="/api/proRate/sort">
                 @foreach($subRecords as $subRecord)
-                    <tr>
-                        <td><a href="/pro_rates/view/{{ $subRecord->uid }}"><i class="fas fa-share-square"></i></a></td>
-<td><?= $subRecord->responsibility ?></td>
-<td><?= $subRecord->code ?></td>
-<td><?= $subRecord->amount ?></td>
-                    </tr>
+                <tr data-uid="{{$subRecord->uid}}">
+                    <td><a href="/pro_rates/view/{{ $subRecord->uid }}"><i class="fas fa-share-square"></i></a></td>
+                    <td><?= $subRecord->responsibility ?></td>
+                    <td><?= $subRecord->code ?></td>
+                    <td><?= $subRecord->amount ?></td>
+                    <td><a href=""><i class="fa fa-bars"></i></a></td>
+                </tr>
                 @endforeach
-                </tbody>
-            </table>
-        </div>
-
+            </tbody>
+        </table>
     </div>
 
-@endsection
+</div>
+
+@endsection

resources/views/admin/section_templates/index.blade.php

@@ -20,9 +20,9 @@
                 <th></th>
             </tr>
         </thead>
-        <tbody id="sortable-section-templates">
+        <tbody class="sortable" data-url="/api/sectionTemplate/sort">
             @foreach($records as $record)
-            <tr data-internal-name="{{$record->internal_name}}">
+            <tr data-uid="{{$record->uid}}" >
                 <td><a href="/section_templates/view/<?= $record->uid ?>"><i class="fas fa-share-square"></i></a></td>
                 <td><a href="/section_templates/view/<?= $record->uid ?>"><?= $record->title ?></a></td>
                 <td><?= $record->internal_name ?></td>

resources/views/layouts/pro-logged-in.blade.php

@@ -310,31 +310,34 @@
     <script>
         $(document).ready(function() {
             $(function() {
-                $("#sortable-section-templates").sortable({
-                    stop: function(event, ui) {
-                        var sectionTemplates = [];
-                        $('#sortable-section-templates').children('tr').each(function(index, element) {
-                            var sectionTemplateInternalName = $(element).attr('data-internal-name');
-                            console.log(index, sectionTemplateInternalName);
-                            sectionTemplates.push({
-                                positionIndex: index,
-                                internalName: sectionTemplateInternalName
+                $('.sortable').each(function(index, el) {
+                    var url = $(el).attr('data-url');
+                    $(el).sortable({
+                        stop: function(event, ui) {
+                            var data = [];
+                            $(el).children('tr').each(function(index, element) {
+                                var uid = $(element).attr('data-uid');
+                                data.push({
+                                    positionIndex: index,
+                                    uid: uid
+                                });
+                            })
+                            console.log(data);
+                            $.ajax({
+                                type: "POST",
+                                url: url,
+                                data: JSON.stringify(data),
+                                contentType: 'application/json',
+                                success: function(response) {
+                                    console.log(response);
+                                },
+                                dataType: 'json'
                             });
-                        })
-                        console.log(sectionTemplates);
-                        $.ajax({
-                            type: "POST",
-                            url: '/api/sectionTemplate/sort',
-                            data: JSON.stringify(sectionTemplates),
-                            contentType: 'application/json',
-                            success: function(response){
-                                console.log(response);
-                            },
-                            dataType: 'json'
-                        });
-                    }
-                });
-                $("#sortable-section-templates").disableSelection();
+                        }
+                    });
+                    $(el).disableSelection();
+                })
+
             });
         })
     </script>