Реальный Живой Поиск и Фильтр Laravel

Question

Я новичок в Laravel и пытаюсь реализовать реальный поиск и фильтрацию в моем проекте, но это не работает вообще.Я не очень понимаю ajax ver и просто копирую и вставляю код с другого сайта.Я пытался понять код, и я думаю, что он правильный, но он не работает, поэтому, пожалуйста, помогите.Спасибо

Вот мой контроллер

 public function search(Request $request)
{
    if($request->ajax())
    {
        $output = '';
        $query = $request->get('query');
        if($query != '')
        {
            $data = Service::table('service')
                ->where('keterangan', 'like', '%'.$query.'%')
                ->orWhere('biaya', 'like', '%'.$query.'%')
                ->get();
        }
        else
        {
            $data = Service::table('service')
            ->orderBy('kodeService', 'asc')
            ->get();
        }
        $total_row = $data->count();
        if($total_row > 0)
        {
            foreach($data as $row)
            {
                $output .= '
                <tr>
                <td>'.$row->kodeService.'</td>
                <td>'.$row->keterangan.'</td>
                <td>'.$row->biayaService.'</td>
                </tr>
                ';
            }
        }
        else
        {
            $output = '
            <tr>
            <td align="center" colspan="5">No Data Found</td>
            </tr>
            ';
        }
        $data = array(
            'table_data'  => $output
        );
        echo json_encode($data);
    }
}

Это скрипт

$(document).ready(function(){
fetch_customer_data();
function fetch_customer_data(query = '')
{
    $.ajax({
            url:"{{ route('live_search.action') }}",
            method:'GET',
            data:{query:query},
            dataType:'json',
            success:function(data)
            {
                $('#table tbody').html(data.table_data);
            }
    });
}

$(document).on('keyup', '#search', function(){
    var query = $(this).val();
    fetch_customer_data(query)
});

});

Маршрут:

Route::resource('service', 'ServiceController');
Route::get('service/search', 'Service@search')->name('live_search.action');

И index.blade

 <table class="table table-striped table-hover table-bordered" id="table">
    <thead>
        <tr>
            <th>Kode Service</th>
            <th>Keterangan</th>
            <th>Biaya</th>
            <th>Aksi</th>
        </tr>
    </thead>
    <tbody>
        @foreach($service as $data)
        <tr>
            <td><?= $data->kodeService?></td>
            <td><?= $data->keterangan ?></td>
            <td><?= $data->biayaService?></td>
            <td>

                <a class="btn btn-sm btn-info" href="{{ route('service.edit', $data['kodeService']) }}"> <i class="oi oi-pencil"></i> Edit</a>
                <button type="button" class="btn btn-sm btn-danger" data-toggle="modal" data-target="#myModal"><span class="oi oi-trash"></span> Hapus</button>
            </td>
        </tr>
        @endforeach
    </tbody>
</table>

Answer 1

Поставьте свой маршрут так:

Route::get('service/search', 'ServiceController@search')->name('live_search.action');
Route::resource('service', 'ServiceController');

После этого откройте панель консоли браузера (нажмите F12, чтобы открыть ее) и проверьте запрос Ajax на вкладке Сеть.

Где вы можете получить конкретную ошибку, если она есть, на вкладке Response.

Answer 2

Если вам нужен дополнительный маршрут к маршруту ресурса, вы должны поместить новый маршрут перед маршрутом ресурса.

 Route::get('service/search', 'ServiceController@search')->name('live_search.action');
 Route::resource('service', 'ServiceController');