如何在mongodb的laravel中使用实时搜索?

时间:2019-04-16 10:38:23

标签: php ajax laravel mongodb livesearch

我在laravel中使用实时搜索,我在部门模块中工作,因为有2个部门的字段名称并由字段创建 我的数据库是mongoDb, 这是我的查看文件代码,

                    <div class="table-responsive m-t-40">
                        <div class="form-group">
                            <input type="text" name="search" id="search" class="form-control" placeholder="Search Department">
                        </div>

                        <table class="table table-bordered table-striped ">
                            <thead>
                                <tr>
                                    <th>Department Name</th>
                                    <th>Created By</th>
                                    <th>Created On</th>
                                    @if (App\User::isPermitted(['edit_department', 'update_department', 'delete_department']))
                                    <th>Action</th>
                                    @endif
                                </tr>
                            </thead>
                            <tbody>
                               @if($listOfDepartment != null)
                                    @foreach($listOfDepartment as $departmentList)
                                        <tr>
                                            <td>{{$departmentList->nameOfDepartment}}</td>
                                            <td>{{$departmentList->createdBy}}</td>
                                            <td>{{$departmentList->created_at}}</td>
                                            @if (App\User::isPermitted(['edit_department', 'update_department', 'delete_department']))
                                                <td>
                                                    <a href="{{route('edit_department', $departmentList->id)}}"  data-toggle="modal" data-target="#myEditModal"><i class="fa fa-edit fa-lg" style="color:#0066ff" aria-hidden="true"></i></a>&emsp;
                                                    <a href="{{route('delete_department', $departmentList->id)}}"><i class="fa fa-trash fa-lg" onclick="delete_user(this); return false;" style="color:red" aria-hidden="true"></i></a>
                                                </td>
                                            @endif
                                        </tr>
                                    @endforeach
                                @endif
                            </tbody>
                        </table>
                    </div>
                </div>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
        $(document).ready(function(){

         fetch_customer_data();

         function fetch_customer_data(query = '')
         {
          $.ajax({
           url:"{{ route('list_department') }}",
           method:'GET',
           data:{query:query},
           dataType:'json',
           success:function(data)
           {
            $('tbody').html(data.table_data);
           }
          })
         }

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

</script>
@endsection

这是我的路线文件

Route::get('list-department', 'DepartmentController@listDepartment')->name('list_department');

这是我在控制器文件中的代码

  public function listDepartment(Request $request)
    {
        $listOfDepartment = Department::all();  

        if($request->ajax())
        {
            $output = '';
            $query = $request->get('query');
            if($query != '')
            {
                $data = Schema::table('department')
                    ->where('nameOfDepartment', 'like', '%'.$query.'%')
                    ->orWhere('createdBy', 'like', '%'.$query.'%')
                    ->get();
            }
            else
            {
                $data = Schema::table('department')
                    ->orderBy('nameOfDepartment', 'asc')
                    ->get();
            }

            $total_row = $data->count();
            if($total_row > 0)
            {
                foreach($data as $row)
                {
                    $output .= '<tr>
                    <td>'.$row->nameOfDepartment.'</td>
                    <td>'.$row->createdBy.'</td>
                    </tr>';
                }
            }
            else
            {
                $output = '
                <tr>
                    <td align="center" colspan="5">No Data Found</td>
                </tr>
                ';
            }
                $data = array(
                'table_data'  => $output,
                'total_data'  => $total_row
                );
                echo json_encode($data);

            }
        return view('pages.department', compact('listOfDepartment'));
    }

问题在于,无论我在搜索栏中写的是什么,现在都可以提供任何输出。

1 个答案:

答案 0 :(得分:0)

您可以使用jquery contains返回其内部的每个字符串

 $(document).ready(function(){
     var string =  'Any string';
     jQuery.expr[":"].Contains = jQuery.expr.createPseudo(function(arg) {
       return function( elem ) {
       return jQuery(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
     };
    });
    jQuery("tr").hide()//It will hide all the tr elements
    jQuery('tr:Contains("'+ string +'")').show();//then will show only tr which has the string
});

我已经制定了这个算法,也使用了它