Question

我是Laravel的新手，并尝试在我的项目上实现实时搜索和过滤，但这根本无法正常工作。我不太了解ajax，只是从其他网站复制粘贴代码。我试图理解该代码，但我认为它是正确的，但是它不起作用，请提供帮助。谢谢

这是我的控制人

 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请求。

在“响应”选项卡中可以找到特定错误的位置。

Answer 2

如果您需要到资源路由的额外路由，则应将新路由放在资源路由之前。

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

实时搜索和过滤器Laravel

2 个答案: