Como comprobar si un input:file, ha cambiado de estado sin darle al submit
Tengo un código muy sencillo
<div class="row"> <div class="col-md-5 col-md-offset-3"> <form action="" method="POST" enctype="multipart/form-data" > <div class="form-group"> <label for="">SELECCIONE UN ARCHIVO A SUBIR</label> <input type="file" class="form-control" name="userfile" > </div> <input type="submit" class="btn btn-primary" value="SUBIR IMAGEN" /> </div> </form> </div> </div>
La idea es la siguiente, si seleccionas un fichero, entonces te muestra el botón y puedes enviar el formulario, si no seleccionas un fichero no se muestra el botón.
Dudo que se pueda hacer en php (lo preferiría), ya que tiene que hacer la comprobación en vivo, así que supongo que seria en javascript o jquery, pero no lo consigo hacer que me funcione.
¿Alguna idea?
1 Respuesta
Respuesta de Ever Escoto
Prueba con esto: Efectivamente con un poco de javascript se alcanza la idea.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Mostrar boton al seleccionar archivo</title>
<script>
function mostrar(){
var x = document.getElementById("myFile").selected;
if(x!=""){
document.getElementById("btn").style.display = "block";
}
}
</script>
</head>
<body>
<div class="row">
<div class="col-md-5 col-md-offset-3">
<form action="" method="POST" enctype="multipart/form-data" >
<div class="form-group">
<label for="">SELECCIONE UN ARCHIVO A SUBIR</label>
<input type="file" class="form-control" name="userfile" id="myFile" onchange="mostrar();" >
</div>
<input type="submit" class="btn btn-primary" value="SUBIR IMAGEN" id="btn" style="display:none;" />
</div>
</form>
</div>
</div>
</body>
</html>
