Реализовать панель поиска Laravel/AJAX

Question

Здравствуйте, я могу выполнить стандартный поиск AJAX/PHP, но трудно преобразовать его в Laravel. Я использую ключ вместо нажатия кнопки. Я не уверен, что это правильный путь, который я собираюсь реализовать панель поиска ajax/laravel. Я ищу для вывода данных базы данных в div на странице просмотра, но вам нужна помощь в этом. Если кто-то думает, что я делаю это неправильно, пожалуйста, сообщите мне. Всегда готов изучить новый код.

Контроллер:

<?php 

namespace App\Http\Controllers; 

use App\Patient; 

use DB; 

use Illuminate\Http\Request; 

class PatientController extends Controller 
{ 


public function search(Request $request) { 
    // get the search term 
    $text = $request->input('text'); 

    // search the members table 
    $patients = DB::table('patients')->where('firstname', 'Like', $text)->get(); 


    // return the results 
    return response()->json($patients); 
} 

} 

Маршрут:

Route::get('search', 'PatientController@search'); 

Вид:

@extends('Layout.master') 


@section('content') 


    <!-- Ajax code --> 

     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 


    <script type="application/javascript"> 
    $(document).ready(function(){ 

     $('#txtSearch').on('keyup', function(){ 

      var text = $('#txtSearch').val(); 

      $.ajax({ 

       type:"GET", 
       url: '127.0.0.1:8000/search', 
       data: {text: $('#txtSearch').val()}, 
       success: function(data) { 

        console.log(data); 

       } 



      }); 


     }); 

    }); 
    </script> 

    <div style="margin-top:70px;"></div> 


     @include('partials._side') 

    <div class="container"> 

        <form method="get" action=""> 

        <div class="input-group stylish-input-group"> 
         <input type="text" id="txtSearch" name="txtSearch" class="form-control" placeholder="Search..." > 
         <span class="input-group-addon"> 
          <button type="submit"> 
           <span class="glyphicon glyphicon-search"></span> 
          </button> 
         </span> 
        </div> 

        </form> 


      <div id="result"></div> 

</div> 

@endsection 

Answer 1

В вашем изменении AJAX запроса:

'127.0.0.1:8000/search' 

к

'/search' 

Я предлагаю вам использовать jQuery Autocomplete

Очень прост в настройке.

Check out the API documentation.

Answer 2

В зависимости от версии Laravel (новые версии используют это):

use Illuminate\Http\Request; 

public function search(Request $request) { 
    $text = $request->input('text'); 

    $patients = DB::table('patients')->where('firstname', 'Like', "$text")->get(); 

    return response()->json($patients); 
} 

А затем в JavaScript:

$(document).ready(function(){ 

    $('#txtSearch').on('keyup', function(){ 

     var text = $('#txtSearch').val(); 

     $.ajax({ 

      type:"GET", 
      url: 'search', 
      data: {text: $('#txtSearch').val()}, 
      success: function(response) { 
       response = JSON.parse(response); 
       for (var patient of response) { 
        console.log(patient); 
       } 
      } 



     }); 


    }); 

}); 

https://laravel.com/docs/5.1/requests#retrieving-input.

Answer 3

Если вы имеете в виду результат обработки в браузере, проверьте его в AJAX, закодированном с помощью jQuery, переменная «response» - это сервер, возвращающий данные. Вам нужно просто заполнить возвращенные данные на свою страницу после завершения AJAX.

Например положить в

<div id="searchResult"></div> 

Вам нужно поместить ниже внутри AJAX после ответа, возвращаясь с JQuery, как:

$("#searchResult").html(response);