Html:
<div class="wrapper">
<form id="formulario1" method="post" enctype="multipart/form-data">
<input id="archivo1" type="file" name="name_archivo">
<label id="label1" for="archivo1">Elige un archivo</label>
<div id="boton_archivo">Sube archivo</div>
</form>
</div>
Js:
$(document).ready(function(){
$('#boton_archivo').on('click', function() { // Subida de archivos
var formData = new FormData();
formData.append('archivo',document.getElementById('archivo1').files[0]);
$.ajax({
url: 'subida.php',
type: 'POST',
data: formData,
processData: false,
success: function(respuesta){
alert(respuesta);
}
});
});
$('#archivo1').on('change', function(event) {
var nombre = document.getElementById('archivo1');
var variable = nombre.files[0].name;
document.getElementById('label1').innerHTML = variable;
}); });
Php:
<?php
$auxiliar = "";
$path_archivo = "";
$ext_archivo = "";
$error = 0;
if(isset($_FILES['name_archivo']['name'])){
$carpeta = "uploads/";
$path_archivo = $carpeta.$_FILES['name_archivo']['name']; // uploads/domi.jpg
$ext_archivo = pathinfo($path_archivo,PATHINFO_EXTENSION);
if (file_exists($path_archivo)) {
$auxiliar = "Este nombre de archivo ya existe en el servidor.";
$error = 1;
}
else{
if ($_FILES['name_archivo']['size'] > 500000) {
$auxiliar = "El peso del archivo sobrepasa lo establecido (500KB).";
$error = 1;
}
else{
if ($ext_archivo != "pdf") {
$auxiliar = "Solo se aceptan archivos PDF.";
$error = 1;
}
}
}
if ($error == 1) {
echo "Ha habido un error: ".$auxiliar;
}
else{
if (move_uploaded_file($_FILES['name_archivo']['tmp_name'], $path_archivo)) {
echo "El archivo ".$_FILES['name_archivo']['name']." se ha subido correctamente.";
}
}
}
else{
echo "Vacio...";
}?>
The label
use it to be able to style the input
file.
The problem is that I keep getting the message "Empty ...", I do not understand why the file is not coming to the php.