North-Hackathon/silent-auction
2
0
Fork 0
forked from TFMM/silent-auction
Code Pull Requests Activity

feat: make showcars table sortable using list.js

Browse Source
This commit is contained in:
Russ Long
2026-05-01 12:20:35 -04:00
parent 81dbf11592
commit bd93dd0bf7
1 changed files with 21 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/showcars.blade.php
+21 -12
View File
@@ -16,24 +16,24 @@
<div class="col-12"> <div class="col-12">
<div class="card"> <div class="card">
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-vcenter card-table"> <table class="table table-vcenter card-table" id="showcars-table">
<thead> <thead>
<tr> <tr>
<th>Bidder #</th> <th class="sort" data-sort="bidder-num">Bidder #</th>
<th>Make</th> <th class="sort" data-sort="make">Make</th>
<th>Model</th> <th class="sort" data-sort="model">Model</th>
<th>Year</th> <th class="sort" data-sort="year">Year</th>
<th>Owner</th> <th class="sort" data-sort="owner">Owner</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody class="list">
@foreach($vehicles as $vehicle) @foreach($vehicles as $vehicle)
<tr> <tr>
<td>{{ $vehicle->vehicleOwner->bidder_assigned_number ?? 'N/A' }}</td> <td class="bidder-num">{{ $vehicle->vehicleOwner->bidder_assigned_number ?? 'N/A' }}</td>
<td>{{ $vehicle->make }}</td> <td class="make">{{ $vehicle->make }}</td>
<td>{{ $vehicle->model }}</td> <td class="model">{{ $vehicle->model }}</td>
<td>{{ $vehicle->year }}</td> <td class="year">{{ $vehicle->year }}</td>
<td> <td class="owner">
@if($vehicle->vehicleOwner) @if($vehicle->vehicleOwner)
{{ $vehicle->vehicleOwner->bidder_fname }} {{ $vehicle->vehicleOwner->bidder_lname }} {{ $vehicle->vehicleOwner->bidder_fname }} {{ $vehicle->vehicleOwner->bidder_lname }}
@else @else
@@ -51,3 +51,12 @@
</div> </div>
</div> </div>
@endsection @endsection
@section('js')
<script src="https://cdnjs.cloudflare.com/ajax/libs/list.js/2.3.1/list.min.js"></script>
<script>
new List('showcars-table', {
valueNames: ['bidder-num', 'make', 'model', 'year', 'owner']
});
</script>
@endsection