在 Laravel 或 PHP 的搜索字段中顯示 Json

Question

我需要在搜索欄上顯示搜索值。

我的控制器代碼：

$q = Input::get('q');
  $query = Jobs::select('job_title')->Where('job_title', 'LIKE', '%'.$q.'%')->get();
  return response()->json($query);

我的 jquery axios 代碼：

 $(document).ready(function(){
  $("#jobsearch").keyup(function(){
     url = "{{route('searchexistingjob')}}";
     var word = $("#jobsearch").val();
     const data = {
       'q' : word
     }
     axios.post(url,data).then(response =>{
        for(i=0; i<response.data.length; i++){
            // $('#jobsearch').val(response.data[i].value);           
     });
  });
});

HTML代碼

<input type="text" id="txtjobsearch" name="txtjobsearch" class="form-control" placeholder="Job title, designation, description..." autocomplete="off" data-id="1">

所有的事情都是正確的，但我需要如何在搜索框中顯示該值有什么想法嗎？

Answer 1

如果可以，您可以更改響應格式

$q = Input::get('q');
$query = Jobs::select('job_title')->Where('job_title', 'LIKE', '%'.$q.'%')->get();
return response()->json([
    search_terms => $q,
    results => $query,
]);

或者當您使用 ajax 時，您已經有了搜索詞：

所以而不是：

$('#jobsearch').val(response.data[i].value);  

您將使用：

$('#jobsearch').val(word);  

或者只是刪除該行並保留已鍵入的內容。

Answer 2

您可以通過幾個簡單的步驟來完成。

創建一個路由，使用相同的鏈接、控制器和功能，只需使用 POST 方法。 將輸入框包裹在表單中，提交后跳轉到同一個頁面。 在該控制器@函數中創建變量，讓我們說：

$result = "";

並將該變量傳遞給視圖。 在視圖中，將該輸入的值設置為 $result;

如果尚未查詢，則該輸入將是 clear($result = '';)，否則，它將顯示該查詢的結果。

// routes/web.php 
Route::get('/home', 'SearchBarController@index');
Route::post('/home', 'SearchBarController@index');

// app/Http/Controllers/SearchBarController.php
public function index()
{
    $result = '';
    if(request()->isMethod('post'))
    {
        $q = Input::get('textjobsearch');
        $query = Jobs::select('job_title')->where('job_title', 'LIKE', '%'.$q.'%')->get();
        $result = json_encode($query);
    }

    return view('searchbar.index', compact('result'));
}

// resources/views/searchbar/index.blade.php

<form method='post'>
    <input type="text" id="txtjobsearch" name="txtjobsearch" value="{{ $result }}" class="form-control" placeholder="Job title, designation, description..." autocomplete="off" data-id="1">
<input type='submit' />
</form>

而已。

就那么簡單。