Laravel 5.7 中 ajax POST 的最小工作示例

Posted

技术标签:

【中文标题】Laravel 5.7 中 ajax POST 的最小工作示例【英文标题】:Minimum Working Example for ajax POST in Laravel 5.7 【发布时间】:2019-05-23 08:52:02 【问题描述】:

有人可以在刀片模板中展示一个 Laravel 5.7 后 ajax 示例和一个完整的最小示例吗?我知道网络上有一些资源,但我错过了一个简洁、直接的最小示例。

【问题讨论】:

你是说 laravel ajax 例子? 【参考方案1】:

你可以这样做, web.php

  Route::post('/admin/order/id', 'OrderController@edit')->name('admin.order.edit');

blade.php

 $(document).on('click', '.delete-button', function (e) 
        e.preventDefault();
        var orderId = 1
        $.ajax(
            type: 'post',
            url: '/admin/order/' + orderId,
            data: 
                '_token': $('input[name=_token]').val(),
                 'data_one': 'dataone',
            ,
            success: function ()      
                toastr.success('Order Has Been Deleted Successfully.');
            ,
            error: function(XMLHttpRequest) 
                toastr.error('Something Went Wrong !');
            
        );

    );

【讨论】:

【参考方案2】:
$.ajax(
    url: 'http://some.working/url',
    type: "POST",
    data: $('#formContainer').serialize(),
    success: function (response) 
        console.log('Success', response);
    , 
    error: function (response) 
        console.log('Error', response);
    
);

The data can be produced in many ways for example
1. Using serialize() method as shown in the above example.
2. Using FormData():
   for example
   var data = new FormData($('#formContainer'));

In both of the above example, one thing compulsory is that your form 
must contain csrf field. which can be provided using any of the 
following methods:
<input type="hidden" name="_token" value=" csrf_token() " >
or 
 csrf_field() 
or even more simply by just using 
@csrf

in some where in your form.

In case you are not using any form, you can create the data object by 
yourself like this
var data = 
   _token: ' csrf_token() ',
   data1: 'Value1',
   data2: 'Value2',
   data3: 'Value2'

【讨论】:

【参考方案3】:

定义网络路由

Route::get('currencies/fiat/changeStatus','FiatCurrencyController@changeStatus')->name("currencies.fiat.chanageStatus");

点击时调用此函数 onclick="changeStatus(1,0)"

function changeStatus(id,status)

            var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
            $.ajax(
                /* the route pointing to the post function */
                url: '/currencies/fiat/changeStatus',
                type: 'GET',
                /* send the csrf-token and the input to the controller */
                data: _token: CSRF_TOKEN,cid:id,status:status,
                dataType: 'JSON',
                /* remind that 'data' is the response of the AjaxController */
                success: function (data) 
                    console.log(data);



                
            );
        

到此为止。

【讨论】:

【参考方案4】:
$(document).ready(function()
/* In laravel you have to pass this CSRF in meta for ajax request  */
$.ajaxSetup(
  headers: 
      'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
  
);

/* change in website layout base on click */
$('#user_view').on('click',function (e)
    e.preventDefault();
    $('.loading_screen').show();
    var val = $(this).data('id');
    $.ajax(
        url: base_path + 'user/changeview/'+val,
        type: "POST",
        success: function (data) 
            var obj = jQuery.parseJSON(data);
            if (obj.SUCC_FLAG == 0)
              window.location.href = site_url;
          else
              /* for console error message. */
              console.log(obj.MSG);
          $('.loading_screen').hide(); 
       ,
       error: function () 
          alert("server error");
         
    );
);

);

嘿,这是一个有效的代码,我希望这对你有用。

【讨论】:

以上是关于Laravel 5.7 中 ajax POST 的最小工作示例的主要内容,如果未能解决你的问题,请参考以下文章

e.preventDefault 不适用于 laravel 5.7

Laravel 5.7 Ajax 发布请求返回 419 状态码

如何在 Laravel 5.7 中将多个数据库数据传递到 jQuery 的自动完成(AJAX)中

如何在 laravel 5.7 中删除用户? [复制]

Laravel 的 Ajax Post 请求中缺少参数

使用 Laravel 将 jQuery Ajax POST 请求作为 GET 发送