Laravel Datatables从GET变量获取数据

时间:2018-02-05 22:34:28

标签: php ajax laravel laravel-5 laravel-5.5

Laravel 5.5

我有一个搜索视图,用户可以在其中输入text input字段来搜索表格。请求转到结果刀片上的GET变量。

在结果刀片中,有一个Laravel ajax表。 https://datatables.yajrabox.com/

我无法弄清楚如何将URL中的GET变量传递给搜索Laravel ajax请求。

最终,我希望能够将$_GET lead_name,lead_phone等传递给此ajax请求。我怎么能做到这一点?

这是我在页面底部的数据表脚本:

<script>
$(function() {
    $('.datatable').DataTable({
        processing: true,
        serverSide: true,
        ajax: {
            url: '{{ route('SearchResults') }}',
            method: 'GET'
        },
        columns: [
            { data: 'lead_name', name: 'leads.lead_name' },
            { data: 'lead_merchant_id', name: 'leads.lead_merchant_id'},
            { data: 'lead_address_city', name: 'leads.lead_address_city' },
            { data: 'lead_address_state', name: 'leads.lead_address_state' },
            { data: 'accountstatus_description', name: 'accountstatus.accountstatus_description' },
            { data: 'firstlast_name', name: 'name' }
        ],
        rowReorder: {
            selector: 'td:nth-child(0)' 
           },
        responsive: true
    });
});

如果我在搜索结果路线上运行dd:

public function SearchResults(request $request) {
    dd($request);
}

它不会返回任何以前的GET数据。

2 个答案:

答案 0 :(得分:2)

无需通过GET方法发送,您可以通过以下方式轻松使用POST方法:

您的页面上应该有一个表单,其中包含POST方法和唯一ID

<form method="POST" id="search-form" role="form">
      {{csrf_field()}}
      <input type="text" name="lead_phone">
</form>

在您的页面上,在提交表单

时编写运行此代码的jquery代码
$(document).ready(function(){
    $('#search-form').on('submit', function(e) {
        table.draw();
        e.preventDefault();
    });
});

然后对DataTable部分使用以下代码

$(function() {
  var table = $('.datatable').DataTable({
    processing: true,
    serverSide: true,
    ajax: {
        url: '{{ route('SearchResults') }}',
        type: "post",
        data: function (d) {
              d.lead_phone = $('input[name=visited]').val();
              d._token = _token;
        },
    },
    columns: [
        { data: 'lead_name', name: 'leads.lead_name' },
        { data: 'lead_merchant_id', name: 'leads.lead_merchant_id'},
        { data: 'lead_address_city', name: 'leads.lead_address_city' },
        { data: 'lead_address_state', name: 'leads.lead_address_state' },
        { data: 'accountstatus_description', name: 'accountstatus.accountstatus_description' },
        { data: 'firstlast_name', name: 'name' }
    ],
    rowReorder: {
        selector: 'td:nth-child(0)' 
       },
    responsive: true
  });
});

如果数据是由Query String发送的,则不需要jquery代码和表单,只需在DataTable部分中记下以下代码

$(function() {
  var table = $('.datatable').DataTable({
    processing: true,
    serverSide: true,
    ajax: {
        url: '{{ route('SearchResults') }}',
        type: "post",
        data: function (d) {
              d.lead_phone = '{{$_GET['lead_phone']}}';
              d._token = '{{csrf_token()}}';
        },
    },
    columns: [
        { data: 'lead_name', name: 'leads.lead_name' },
        { data: 'lead_merchant_id', name: 'leads.lead_merchant_id'},
        { data: 'lead_address_city', name: 'leads.lead_address_city' },
        { data: 'lead_address_state', name: 'leads.lead_address_state' },
        { data: 'accountstatus_description', name: 'accountstatus.accountstatus_description' },
        { data: 'firstlast_name', name: 'name' }
    ],
    rowReorder: {
        selector: 'td:nth-child(0)' 
       },
    responsive: true
  });
});

然后获取您发送给控制器的数据

public function DataTable(Request $request)
{
   $lead_phone = $request->get('lead_phone');
   .
   .
   .
}

答案 1 :(得分:0)

请指定发送数据的method

<script>
$(function() {
    $('.datatable').DataTable({
        processing: true,
        serverSide: true,
        method: post,
        ajax: '{{ route('SearchResults') }}',
        columns: [
            { data: 'lead_name', name: 'leads.lead_name' },
            { data: 'lead_merchant_id', name: 'leads.lead_merchant_id'},
            { data: 'lead_address_city', name: 'leads.lead_address_city' },
            { data: 'lead_address_state', name: 'leads.lead_address_state' },
            { data: 'accountstatus_description', name: 'accountstatus.accountstatus_description' },
            { data: 'firstlast_name', name: 'name' }
        ],
        rowReorder: {
            selector: 'td:nth-child(0)' 
           },
        responsive: true
    });
});