Permitir subir archivo con extensiones determinadas

Bier · #1 (**permalink**) 25/02/2012, 10:51

Tengo una página para subir imágenes JPG y GIF al servidor, trabaja bien.
El problema es que, al usuario se le muestran archivos con todas las extensiones. (La validación la hago posterior con PHP)
Deseo mostrar solo archivos con extensión permitida.

En las FAQ de JS existe un artículo al respecto en:
http://www.forosdelweb.com/wiki/Java...D%27FILE%27%3F

Traté de incluir esa función, pero no logro hacerlo que funcione, quizá no lo he escrito adecuadamente.
Al ver el código de esta función, incluso imagino no me es útil, pues lo que hace es validar lo seleccionado por el usuario, y lo que deseo es que el usuario solo vea archivos de extensión JPG y GIF

Esta es mi página original:

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Subir imagen JPG</title>
</head>
<body>
<form id="idNombreForm" name="nombreForm" method="post" action="subir2.php" enctype="multipart/form-data">
<input name="img_up" type="file" id="img_up"/>
<input type="submit" name="guardar3" id="guardar3" value="Guardar"/>
</form>
</body>
</html>

Esta es mi página adicionando la función:

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Subir imagen JPG</title>
 
<SCRIPT LANGUAGE="JavaScript">
function LimitAttach(tField,iType) { 
file=tField.value; 
if (iType==1) { 
extArray = new Array(".gif",".jpg",".png"); 
} 
if (iType==2) { 
extArray = new Array(".swf"); 
} 
allowSubmit = false; 
if (!file) return; 
while (file.indexOf("\\") != -1) file = file.slice(file.indexOf("\\") + 1); 
ext = file.slice(file.indexOf(".")).toLowerCase(); 
for (var i = 0; i < extArray.length; i++) { 
if (extArray[i] == ext) { 
allowSubmit = true; 
break; 
} 
} 
if (allowSubmit) { 
} else { 
tField.value=""; 
alert("Usted sólo puede subir archivos con extensiones " + (extArray.join(" ")) + "\nPor favor seleccione un nuevo archivo"); 
} 
}
</SCRIPT>
 
</head>
<body>
<form id="idNombreForm" name="nombreForm" method="post" action="subir2.php" enctype="multipart/form-data">
<input name="img_up" type="file" id="img_up" onblur="LimitAttach(this,1);"/>
<input type="submit" name="guardar3" id="guardar3" value="Guardar"/>
</form>
</body>
</html>

Agradeceré si alguien me da una idea del camino a seguir.

Saludos