I am encountering an issue while attempting to submit a form using ajax. The error message
The POST method is not supported for this route. Supported methods: GET, HEAD.
keeps appearing. Despite searching on platforms like Stackoverflow, no solution seems to work for me. How can I resolve this issue?
The Blade file
<form method="POST" enctype="multipart/form-data">
<input type="hidden" value="{{csrf_token()}}" id="token"/>
<div class="form-group" >
<label for="title">Title</label>
<input type="text" name="title" >
</div>
<div class="form-group">
<label for="description">Description</label>
<input type="text" name="description">
</div>
<button type='submit' id="btn" >submit
</form>
Javascript code snippet
<script>
$(document).ready(function(){
$("#btn").click(function(event){
event.preventDefault();
var url = '{{ route('review.store') }}';
var form = $('form')[0];
var formData = new FormData(form);
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.ajax({
url: url,
data: formData,
type: 'POST',
cache: false,
contentType: false,
processData: false,
success:function(data){
if($.isEmptyObject(data.error)){
$("#msg").html("successfull");
$("#msg").fadeOut(3000);
}
}
});
});
});
</script>
Route Configuration
Route::post('review', 'ProductReviewController@store')->name('review.store');