在Laravel中使用AJAX搜索数据

Question

这是我的ajax代码。 我想在文本框中输入内容，数据库的结果应显示在表中。

<script type="text/javascript">
  function retrieve(){
    var country = $('#country_name').val();
    $.ajax({
      type: "POST",
      url: '{{route('dataAjax-country')}}',
      data: {country:country},
      success: function(result){
        $('#ajaxtable').html(result);
      }
    });
  }
</script>

但是，当我在文本框中键入内容时，数据不会改变。 我有一个文本框和一个像这样的表：

{!! Form::text('country_name', '', array('id'=>'country_name', 'onkeyup'=>'retrieve()')) !!}

<tbody id="ajaxtable">
  @foreach($results as $result)
    <tr>
      <td>{{$result->id}}</td>
      <td>{{$result->country_name}}</td>
    </tr>
  @endforeach
</tbody>

这是我的路线代码，也许我缺少我的路线？：

Route::get('asd', array(
        'as' => 'dataAjax-country', 'uses' => 'CompaniesController@dataAjaxCountry'));

我的控制器包含将在表中显示的AJAX脚本：

public function dataAjaxCountry()
{
    echo "<tr><td>asdsad</td></tr>";
}

Answer 1

您正在发送发帖请求，但您在路线上使用的是get，需要将您的type更改为get ，记录任何错误也很有用，请尝试：

<script type="text/javascript">
  function retrieve(){
    var country = $('#country_name').val();
    $.ajax({
      type: "get",
      url: '{{route('dataAjax-country')}}',
      data: {country:country},
      success: function(result){
        $('#ajaxtable').html(result);
      },
      error: function(result){
        console.log(result);
      }
    });
  }
</script>

Answer 2

有两点，您尝试将POST到定义为GET路由的控制器。 下面应该工作

<script type="text/javascript">
  function retrieve(){
    var country = $('#country_name').val();
    $.ajax({
      type: "GET",
      url: '/asd',
      data: {country:country},
      success: function(result){
        $('#ajaxtable').html(result);
      }
    });
  }

您需要包装您的<tbody>插入一个<table>

我更改了此设置，因为该路由url: '{{route('dataAjax-country')}}',使用url: '{{route('dataAjax-country')}}',

Answer 3

在浏览器中使用开发人员控制台并检查服务器返回的错误将非常有用。 从上面的代码中，很可能是错误的路由方法（它是为GET定义的，但是您正在通过AJAX发送POST请求），并且您没有随数据一起发送会话令牌。 尽管它有些旧，但是本文应该可以帮助您开始使用Laravel和AJAX： 在Laravel中使用AJAX