I searched the SOF for sending image with Jquery, I tried several and it did not work, and others just for form field, the event should send the image with% OFF form.
Input (No form):
<input id='ads-files-edit' type='file' accept='image/*' placeholder='Selecione a imagem' data-max-size='5242880' class='form-control form-group-lg ads-files-edit'>
Jquery:
<script type="text/javascript">
$(function () {
$("#ads-files-edit").change(function () {
});
}
</script>
No form and no submit button
index.html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><inputid='ads-files-edit'type='file'accept='image/*'placeholder='Selecioneaimagem'data-max-size='5242880'class='form-controlform-group-lgads-files-edit'><scriptlanguage="javascript">
$(document).ready(function() {
$('#ads-files-edit').change(function(){
var file_data = $('#ads-files-edit').prop('files')[0];
var form_data = new FormData();
form_data.append('file', file_data);
$.ajax({
url: "upload-imagem.php",
type: "POST",
data: form_data,
contentType: false,
cache: false,
processData:false,
success: function(data){
$("#result").html(data);
}
});
});
})
</script>
<div id="result"></div>
upload-image.php
<?php
$userFile=$_FILES['file'];
$name = $userFile['name'];
$tmp = $userFile ['tmp_name'];
if(empty($userFile)):
echo '<a href="uploadFoto.htm">Selecione um arquivo para fazer upload</a>';
else:
if(move_uploaded_file($tmp, 'uploads/'.$name)):
echo 'Arquivo enviado com sucesso';
else:
echo 'Error';
endif;
endif;
?>