How to send a file and a text field with a form and process the json response?
Hello I am a rookie using jquery, and I took a couple of days trying to get upload a file, but do not know. I have read a lot of manuals and have tried a lot of plugins that I found on google, but not having much idea I could achieve my goal
My goal is to send a form with two fields: a picture and a key, to http://www.dumpyourphoto.com/api/upload_photo/json. This website will give me back a reply with the url of the photo that is what I have to deal.
I've failed with this
-
<script type="text/javascript">
$(function() {
$('#my-form').submit(
function() {
$.post('
http://www.dumpyourphoto.com/api/upload_photo/json',
{ key: $('input[name="key"]').val(), photo: $('input[name="photo[]"]').
val() }, function(data) {
$('img#photo').attr('src', data.sources.large);
});
return false;
});
});
</script>
<img src="" alt="" id="photo" />
<div id="container">
<form action="" method="post" id="my-form" enctype="multipart/form-data">
<input type="hidden" name="key" value="f********
394b195d4e04e90711df3bc61" />
<input id="file" type="file" name="photo[]" />
<input type="submit" name="submit" value="Submit" />
</form>
</div>
From what I've been reading is not possible to do what I want with the function $. post (), how can I do?
Thank you for all and best regards.