Level 2
Hi,
In your header layout put:
<meta name="csrf-token" content="{{ csrf_token() }}">
And in your javascript file put:
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
2 likes
Dec 23, 2015
3
Level 1
TokenMismatchException in VerifyCsrfToken.php
I'm trying to submit a form with AJAX but I run into a TokenMismatchException. The code in my view
<form class="form" id="form-add">
<input type="hidden" name="_token" value="{{ csrf_token() }}">
@foreach($members as $member)
<div class="form-group col-md-3" style="display: none;">
<input type="text" name="user_id" class="form-control" value="{{ $member->user_id }}">
</div>
@endforeach
<div class="form-group col-md-5">
<label for="cartype">Car Type</label>
<select name="cartype" id="cartype" class="form-control">
<option>Choose a car type</option>
@foreach($types as $type)
<option value="{{ $type->cartypeid }}">{{ $type->car_type }}</option>
@endforeach
</select>
</div>
<div class="form-group col-md-5">
<label for="access">Model</label>
<select name="model" id="model" class="form-control">
<option value=""></option>
</select>
</div>
<div class="form-group col-md-2">
<button type="submit" class="btn add-btn btn-primary">Add</button>
</div>
</form>
The javascript
$('#cartype').on('change', function(e){
console.log(e);
var car_id = e.target.value;
$.get('/ajax-model?modid=' + car_id, function (data) {
$('#model').empty();
$.each(data, function (index, accssObj) {
$('#model').append('<option value="' + modObj.modelid + '">' + modObj.model + '</option>');
})
})
});
$(function(){
$('#form-add').submit(function(e){
e.preventDefault();
var _token = $('input[name="_token"]').val();
var user_id = $('input[name="user_id"]').val();
var model = $('input[name="model"]').val();
var data = new FormData();
data.append('_token', _token);
data.append('user_id', user_id);
data.append('model', model);
$.ajax({
url: '/save',
type: 'POST',
data:data,
dataType: "json",
processData: false,
success:function(data){
alert('Item added!');
},
error:function(data){
alert('Failed!');
}
});
});
});
Level 1
If you are using laravel 5.2, you need to put that view on a route under "web" middleware
Level 23
@ChiefJS, as @mosesnagar said :
If you are using laravel 5.2, you need to put that view on a route under "web" middleware
For your javascript, try this :
$(function() {
$('#cartype').on('change', function(e) {
console.log(e);
var car_id = e.target.value;
$.get('/ajax-model?modid=' + car_id, function (data) {
$('#model').empty();
$.each(data, function (index, accssObj) {
$('#model').append('<option value="' + modObj.modelid + '">' + modObj.model + '</option>');
})
})
});
$('#form-add').submit(function(e) {
e.preventDefault();
$.ajax({
url: $(this).attr('action'),
type: $(this).attr('method'),
data: $(this).serialize(),
dataType: "json",
success: function(data) {
alert('Item added!');
},
error: function(data) {
alert('Failed!');
}
});
return false;
});
});
Don't forget to add these attributes to your form :
<form action="/save" method="POST" class="form" id="form-add">
Please or to participate in this conversation.