在 laravel 5 中使用 ajax答案

【问题标题】：use ajax in laravel 5在 laravel 5 中使用 ajax
【发布时间】：2016-05-19 00:03:19
【问题描述】：

这是我的 ajax 代码：

$('select[id=currency-data]').change(function () {

    var currency_id =   $(this).val();

    $.ajax({
        url: "{{Route('exchange-rate')}}",
        type: 'POST',
        data: {currency_id: currency_id },
        success: function(data){
            $('#ex-rate').val(data);
        }
    });
});

查看：

        {!! Form::label('currency_id', 'Currency:', ['class' => 'control-label']) !!}
        {!! Form::Select('currency_id', $currency_data, Input::old('currency_id'), ['id'=>'currency-data','class' => 'form-control','required']) !!}

        {!! Form::label('exchange_rate', 'Exchange Rate:', ['class' => 'control-label']) !!}
        {!! Form::input('number','exchange_rate', Input::old('exchange_rate'), ['id'=>'ex-rate','class' => 'form-control','readonly','required']) !!}

当我运行这个时，我得到错误：VerifyCsrfToken.php 中的TokenMismatchException ..

谁能给出解决方案？？？

【问题讨论】：

标签： ajax laravel

【解决方案1】：

在你的刀片文件的<head>标签上添加这个

<meta name="csrf-token" content="{{ csrf_token() }}">

在你的 javascript 上，在你的 jQuery 库之后，调用：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
});
</script>

【讨论】：

【解决方案2】：

嗨，如果您将 js 和视图文件分开，并希望使用 ajax 提交表单，而不是使用任何 HTML 标记的数据属性来添加这样的 csrf 令牌。

<div id="toke" data-token="{!! csrf_token() !!}"></div>

现在您可以访问 js 文件中的令牌

$.ajax({
    url: "{{Route('exchange-rate')}}",
    type: 'POST',
    data: data: {_token: $('#token').data('token'),currency_id: currency_id },
    success: function(data){
        $('#ex-rate').val(data);
    }
 });
});

第二个选项是创建隐藏输入元素并使用 jquery 表单序列化来获取表单数据

<form id="form-data" action="url" method = 'POST' />    
{!! csrf_field() !!}

{!! Form::label('currency_id', 'Currency:', ['class' => 'control-label']) !!}
{!! Form::Select('currency_id', $currency_data, Input::old('currency_id'), ['id'=>'currency-data','class' => 'form-control','required']) !!}

{!! Form::label('exchange_rate', 'Exchange Rate:', ['class' => 'control-label']) !!}
{!! Form::input('number','exchange_rate', Input::old('exchange_rate'), ['id'=>'ex-rate','class' => 'form-control','readonly','required']) !!}

jquery

var form = $("#form-data");
$.ajax({
        url: form.attr( 'action' ),
        type: 'POST',
        data: form.serialize(),
        success: function(data){
            $('#ex-rate').val(data);
        }
     });
});

【讨论】：

【解决方案3】：

更改
data: {currency_id: currency_id },
到

 data: data: {_token: '{!! csrf_token() !!}',currency_id: currency_id },

【讨论】：