Reputation: 315
i am trying to submit a form with image upload using jquery ajax, but each time i select an image and click on submit button alert($(this).serialize()) shows-
_token=TCWpR3n9Uf2FpKMXi639Dcvzhc7t4fVDWDopjZ8V .
here is my form -
{!! Form::open(['action'=>'ImageController@store', 'name'=>'form1', 'id'=>'formId1', 'files'=>true]) !!}
<div class="form-group">
{!! Form::file('image') !!}
</div>
<div class="form-group">
{!! Form::submit('Upload', array( 'class'=>'btn btn-danger', 'name'=>'image_form_submit' )) !!}
</div>
{!! Form::close() !!}
here the js-
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("form").submit(function(e){ //
e.preventDefault();
alert($(this).serialize()); //always alerts the tocken- _token=TCWpR3n9Uf2FpKMXi639Dcvzhc7t4fVDWDopjZ8V
$.ajax({
type:"POST",
url: $(this).attr('action'),
data: $(this).serialize(),
dataType: 'json',
success: function(data){
console.log(data);
},
error: function(data){
}
})
return false;
});
});
</script>
i want to get the serialized data of form and post via ajax to my controller. why alert always shows the token?
Upvotes: 0
Views: 1285
Reputation: 91
In case of ajax image uploading "$(this).serialize()" didn't work.
You have to pass (data:formData,) as below -
$.ajax({
type:"POST",
url: $(this).attr('action'),
data:formData,
cache:false,
contentType: false,
processData: false,
success: function(data){
console.log(data);
},
error: function(data){
}
})
Upvotes: 1