Sin usar ningún formulario, ¿puedo simplemente enviar un archivo/archivos desde <input type="file">
a 'upload.php' usando el método POST usando jQuery. La etiqueta input no está dentro de ninguna etiqueta form. Se coloca individualmente. Así que no quiero usar plugins de jQuery como 'ajaxForm' o 'ajaxSubmit'.
Puede utilizar FormData para enviar sus datos mediante una petición POST. He aquí un ejemplo sencillo:
var myFormData = new FormData();
myFormData.append('pictureFile', pictureInput.files[0]);
$.ajax({
url: 'upload.php',
type: 'POST',
processData: false, // important
contentType: false, // important
dataType : 'json',
data: myFormData
});
Usted don't tiene que utilizar una forma de hacer una solicitud ajax, siempre y cuando usted sabe que su solicitud de configuración (como url, método y parámetros de datos).
Basándonos en este tutorial, he aquí una forma muy básica de hacerlo:
$('your_trigger_element_selector').on('click', function(){
var data = new FormData();
data.append('input_file_name', $('your_file_input_selector').prop('files')[0]);
// append other variables to data if you want: data.append('field_name_x', field_value_x);
$.ajax({
type: 'POST',
processData: false, // important
contentType: false, // important
data: data,
url: your_ajax_path,
dataType : 'json',
// in PHP you can call and process file in the same way as if it was submitted from a form:
// $_FILES['input_file_name']
success: function(jsonData){
...
}
...
});
});
Don't se olvide de añadir un manejo adecuado de errores
Pruebe este puglin simpleUpload, no necesita formulario
Html:
<input type="file" name="arquivo" id="simpleUpload" multiple >
<button type="button" id="enviar">Enviar</button>
Javascript:
$('#simpleUpload').simpleUpload({
url: 'upload.php',
trigger: '#enviar',
success: function(data){
alert('Envio com sucesso');
}
});