Reputation: 76
here is the html
<input id="fileUpload" multiple="multiple" type="file"/>
<ul>
<li><div id="image-holder"></div></li>
<li><input type="submit" value="Next"></li>
</ul>
here is the script
<script type="text/javascript">
$('#submit').click(function() {
var files = $("[type='file']")[0].files;
console.log(files)
var data = {
'images[]' : files ,
csrfmiddlewaretoken: '{{csrf_token}}'
}
$.ajax({
type: "POST",
url : "{% url 'data_entry' %}",
data: data,
success: function(data) {
},
error: function(response, error) {
}
});
});
</script>
On submit click i get this error
Uncaught TypeError: Illegal invocation
How can i send images using jquery to django view?
Upvotes: 2
Views: 1712
Reputation: 10305
You have to tell the Jquery don't process the files. And also I found the workaround to add file in data... hope this will help...
that Illegal invocation
error is because ajax doesn't handle objects... that's why we serialize form before entering into ajax and now your case you directly inject the file object then the error.
var data = new FormData();
$.each(files, function(key, value)
{
data.append(key, value);
});
And in ajax...
$.ajax({
....
processData: false,
....
Upvotes: 1