Leyenda input file

[mistico24]

Buenas tardes, tengo un pequeño problemita con un input file, resulta que al declararlo me pone junto al botón la leyenda "No se ha seleccionado ningún archivo" y eso me desacomoda todo mi formulario. Habrá forma de quitarle esa leyenda? o en su defecto redireccionarla para que aparezca en un input text deshabilitado como mensaje de inicio?

De antemano gracias y saludos.

[emprear]

Podrías crear un campo input file personalizado

http://foros.emprear.com/html/file-input/

Saludos

[mistico24]

Muchas gracias por tu ejemplo EMPREAR, ya chequé el código fuente de tu ejemplo y la verdad le entendí poco, no manejo al 100% hojas de estilo ni java script pero más o menos le agarre la onda. Trataré de analizar bien el ejemplo para encontrar lo que estaba buscando. Saludos.

[emprear]

Ok @mistico, analizala que no es tan complicada, te aclaro que la personalización se consigue con

Código Javascript:

window.onload =function personaliza(){
// buscar la clase en los divs
var personalizar = document.getElementsByTagName('div');
for (var i = 0; i < personalizar.length; i++) {
if (personalizar[i].className == 'clase_inputfile') {
personalizar[i].className = 'clase_inputfile_js';
}
}
 
var cambia_input_files = document.getElementsByTagName('input');
for (var i = 0; i < cambia_input_files.length; i++) {
if (cambia_input_files[i].className == 'cambia_input_file') {
 
var cambiarclase = cambia_input_files[i].cloneNode(true);
cambiarclase.className = 'cambia_input_file_js';
cambiarclase.style.outline="none";
cambiarclase.style.opacity = 0; 
cambiarclase.style.MozOpacity = 0; 
cambiarclase.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(opacity:0)'; 
 
var padre = cambia_input_files[i].parentNode;
padre.removeChild(cambia_input_files[i]);
padre.appendChild(cambiarclase);
}
}
 
}
 

y las clases correspondientes al css, el resto cumple otros propósitos, validar extensiones, recuperar el nombre del archivo, etc

SAludos

[mistico24]

Listo EMPREAR!!! ya me quedó, ya pude esconder la leyenda que me estorbaba.
Me quedé pensando en otra cosa, tú validas el archivo de entrada cuando lo cargas. Cabría la posibilidad de que al dar click en el botón examinar (en tú caso en el clip) del input file, me enliste sólo los archivos que deseo subir, en mi caso sólo los txt.

De antemano gracias.

[emprear]

Primero te comento, la validación que sirve la hago por php.

Con respecto a lo otro, en html5 existe el atributo accept para los campos file, pero no funciona igual en todos los navegadores ( o simplemente no funciona)

http://www.w3schools.com/html5/att_input_accept.asp

Saludos

[mistico24]

No entendí, lo de los archivos txt dices que se hace con accept pero que no funciona en todos los navegadores, correcto? ya chequé la liga que me enviasté.

Con respecto a lo de la validación, dices que lo haces con php pero en el ejemplo anterior que me enviaste supongo la haces con javascript en la función nombre_ar, o me equivoco?

Muchas gracias, me fue de mucha ayuda el ejemplo anterior, incluso para entender las hojas de estilo.

Saludos.

[emprear]

Si, asi es, usá este link para verificar como se comporta en los diferentes browsers
http://www.w3schools.com/html5/tryit...5_input_accept


Para la validación efectivamente se usa

Código Javascript:

var nombre_archivo = (arr_ruta[arr_ruta.length-1]);
var ext_validas = /\.(pdf|gif|jpg|png)$/i.test(nombre_archivo);
 

Pero hace falta lo anterior, para saber si es windows o no, ya que en windows las rutas ese separan por \ a diferencia de unix /
Seguro que en la web hay otras funciones similares, pero yo me hice esta que me funciona bien en todos los navegadores y no tengo que andar usando jQuery solo para esto

Saludos