Assistance with dataTables not processing my table - Laravel & Ajax - php

Question

I am trying to get dataTables to process my table in Laravel using an ajax script, I have no pages of search function.
'datatables.min.js' pulls through in chrome dev sources from CDN and I know my ajax is working because other scripts work fine on the page.
I am using some basic custom CSS on the table via a custom.css file, but I was under the impression that is fine.
My controller code.
// FETCH ALL AJAX REQUEST
public function fetchAll()
{
$vehicles = Vehicle::all(); //Could be model or controller...
$output = '';
if ($vehicles->count() > 0) {
$output .= '<table #"showAll" class="veh-table table table-striped table-sm text-center align-middle" >
<thead>
<tr>
<th class="tbl-head">ID</th>
<th class="tbl-head">Image</th>
<th class="tbl-head">Make</th>
<th class="tbl-head">Model</th>
<th class="tbl-head">Derivative</th>
<th class="tbl-head">Powertrain</th>
<th class="tbl-head">Transmission</th>
<th class="tbl-head">Fuel Type</th>
<th class="tbl-head">Model Year</th>
<th class="tbl-head"><i class="bi-gear-fill h5"></i></th>
</tr>
</thead>
<tbody>';
foreach ($vehicles as $vehicle) {
$output .= '<tr class="tbl exp_tbl">
<td>'.$vehicle->id.'</td>
<td><img src="./storage/images/'.$vehicle->image.'" class="img-thumbnail justify-content-sm-center"></td>
<td>'.$vehicle->make.'</td>
<td>'.$vehicle->model_name.'</td>
<td>'.$vehicle->version.'</td>
<td>'.$vehicle->powertrain.'</td>
<td>'.$vehicle->trans.'</td>
<td>'.$vehicle->fuel.'</td>
<td>'.$vehicle->model_year.'</td>
<td>
<i class="bi-pencil-square h6"></i>
<i class="bi-trash h6"></i>
</td>
</tr>';
}
$output .= '</tbody></table>';
echo $output;
} else {
echo '<h1 class="text-center text-secondary my-5">No vehicles in the database!</h1>';
}
}
The function from my html.
...
$(function() {
...
// SHOW ALL VEHICLES AJAX REQUEST
fetchAllVehicles();
function fetchAllVehicles(){
$.ajax({
url: '{{route('fetchAll')}}',
method: 'GET',
success: function(res){
$("#show_all_vehicles").html(res);
$("#showAll").DataTable({
order: [ 0, "desc" ]
});
}
});
}
...
}
...
I have tried adding
{
dataType: 'json',
processData: true, // & false...
serverSide: false, // & true...
}
Please let me know if I haven't included some needed information.

Answer 1

Try to change
$output .= '<table #"showAll"....
to
$output .= '<table id="showAll"....
and let me know if that works