在 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>

而已。

就那么简单。