Question

我有观点：

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/base/minified/jquery-ui.min.css" type="text/css" /> 
<script>

$(function()
{
   $( "#q" ).autocomplete({
    source : "{{ url('search/autocomplete') }}",
    minLength: 3,
    select: function(event, ui) {
      $('#q').val(ui.item.value);
    }
  });
});
</script>

<input id="q" placeholder="Search users" name="q" type="text" value="">

控制器：

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\NewTheme;
use App\Http\Requests;
use DB;
use App\Http\Controllers\Controller;
use Illuminate\Support\Facades\Input;
use Auth;
use Response;

class SearchController extends Controller
{
public function autocomplete(){
    $term = Input::get('term');

    $results = array();

    // this will query the users table matching the TagName

    $queries = DB::table('New_Themes')
        ->where('TagName', 'like', '%'.$term.'%')
        ->take(5)->get();

    foreach ($queries as $query)
    {
        $results[] = ['value' => $query->TagName];
    }
return Response::json($results);
}
}

我的路线：

Route::get('search/autocomplete', 'SearchController@autocomplete');

我的问题是，当我在输入标签中输入多于3个字母时，我什么也得不到，这似乎q q的输入不是用值填充的。如果我使用提交按钮添加表单/动作/方法的东西，控制器工作正常，所以问题在于这个ajax调用不能正常工作。

有任何想法为什么这不能正常工作（也许是ajax调用没有正确地路由或类似的东西）？

最终解决方案感谢stack和Borna：

查看：

  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<input type="text" class="form-control" placeholder="TagName" id="searchname" name="TagName">

<script type="text/javascript">
      $('#searchname').autocomplete({
        source:'{!!URL::route('autocomplete')!!}',
          minlength:1,
          autoFocus:true,
          select:function(e,ui)
          {
              $('#searchname').val(ui.item.value);
          }
      });
</script>

控制器：

<?php

namespace App\Http\Controllers;
use \Illuminate\Http\Request;
use App\NewTheme; //Instead of NewTheme, your model name
use Input;
use App\Http\Requests;
use App\Http\Controllers\Controller;
use DB;

class Theme extends Controller {  //Instead of Theme your own controller name
    public function autocomplete(Request $request)
{
    $term = $request->term;

    $queries = DB::table('New_Themes') //Your table name
        ->where('TagName', 'like', '%'.$term.'%') //Your selected row
        ->take(6)->get();

    foreach ($queries as $query)
    {
        $results[] = ['id' => $query->id, 'value' => $query->TagName]; //you can take custom values as you want
    }
return response()->json($results);
}
}

路线：

Route::get('/autocomplete', array('as' => 'autocomplete', 'uses'=>'Theme@autocomplete')); //Instead of Theme your Controller name

Answer 1

$( "#q" ).autocomplete({
    source : "{!!URL::route('search/autocomplete')!!}",
    minLength: 3,
    select: function(event, ui) {
      $('#q').val(ui.item.value);
    }

在控制器中使用return response()->json($results);而不是返回Response :: json（$ results）;

自动完成的另一个代码在视图中

<input type="text" name="searchname" class="form-control" id="searchname" placeholder="search" />

$(document).ready(function () {

      $('#searchname').autocomplete({


          source:'{!!URL::route('autocomplete')!!}',

          // source:"{{ URL::to('autocomplete')}}",
          minlength:1,
          autoFocus:true,
          select:function(e,ui)
          {
              alert(ui);


          }

      });


   });

控制器中的

public function autocomplete(Request $request)
{

      $term=$request->term;
      $data=PaymentInvoice::where('invoice_number','LIKE','%'.$term.'%')->take(10)->get();
      //var_dump($data);

      $results=array();


      foreach ($data as $key => $v) {

          $results[]=['id'=>$v->id,'value'=>$v->invoice_number." Project Name: ".$v->project_name." Amount: ".$v->amount];

      }

      return response()->json($results);

  }

在模型中

class PaymentInvoice extends Model
{
    //

    protected $table='payment_invoice';
    protected $fillable=['project_name','invoice_number','date','paid_to','prepared_by','amount','invoice_details_id','created_at'];
}

Answer 2

路线

Route::post('search/autocomplete', 'messagesController@autocomplete');

HTML

<div class="form-group">
        {!! Form::label('To', 'To:', ['class' => 'col-lg-2 control-label']) !!}
        <div class="col-lg-10">
            {!! Form::text('To', $value = null, ['class' => 'form-control', 'placeholder' => 'To']) !!}
        </div>
    </div>

脚本

  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <meta name="csrf-token" content="{{ csrf_token() }}">
  <script type="text/javascript">

   $(document).ready(function(){
    src = "search/autocomplete";

$( "#To" ).autocomplete({
source: function(request, response) {
        $.ajax({
            headers: {
                     'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
            type: 'POST',
            url: src,
            data: {
                term : request.term
            },
            success: function(data) {
                response(data);

            }
        });
    },
    minLength: 3,
select: function(event, ui) {
  $('#To').val(ui.item.value);
}
 });

    });
  <script>

控制器

public function autocomplete(){
$term = Input::get('term');

$results = array();

$queries = DB::table('rusers')
    ->where('name', 'LIKE', '%'.$term.'%')
    ->take(5)->get();

foreach ($queries as $query)
{
    $results[] = [ 'id' => $query->id, 'value' => $query->name ];
}
return response()->json($results);
}

在laravel中使用ajax调用（Json）自动完成，没有响应

2 个答案:

路线

HTML

脚本

控制器