Evento click() en firefox

[hieloverde]

Hola amigos,

Pues si, lo que pasa es que el siguiente código no me funciona en firefox, se trata del evento click();

Código HTML:

<input type="file" id="fichero" style="display: none;"><input type="text" id="ruta">
<input type="button" value="Seleccionar..." onClick="document.getElementById('fichero').click(); document.getElementById('ruta').value=document.getElementById('fichero').value;"> 

La función de este código es que cuando se presione el boton Seleccionar... debe lanzar el dialogo de selección de archivo del input file y luego poner la ruta del archivo en un text, se entiende?. La falla creo yo, esta en este tramo:

Código:

document.getElementById('fichero').click();

Va perfecto para internet explorer, pero no se como hacerlo funcionar en firefox

Saludos,

[caricatos]

Hola:

Has probado con onclick...

document.getElementById('fichero').onclick();

Saludos

[hieloverde]

Sí le pongo onclick(), en IE me bota el error de "el objeto no acepta esa propiedad o metodo" y en FF la consola de javascript dice "document.getElementById('fichero').onclick() is not a function"...

Es que mas bien la idea es que al dar clic sobre el botón se active el input file para que lance el dialogo de elejir archivo (parte que no funciona en FF) y al seleccionarlo la ruta pase al input text.

Que otra forma hay de hacerlo?

Saludos,

[esteno]

Hola hieloverde,

Entiendo que lo que quieres es guardar en un campo text la ruta del archivo que se selecciona con un campo file.

Y como bien dices el código que has puesto en Firefox no funciona, asi que lo que se me ocurre es darle un poco la vuelta al asunto, es decir, seleccionar el archivo con el campo file y copiarlo al campo text. Por ejemplo:

Código PHP:

  <form action="" method="post" name="form"> 
 
<input type="file" name="fichero" id="fichero" onchange="document.form.ruta.value = document.form.fichero.value;"> 
<input type="text" name="ruta" id="ruta"> 
 
</form>  
   

hieloverde, si se puede saber, qué fin tiene la ruta del campo file en el campo text?

Saludos

[hieloverde]

Hola esteno ,

La idea es que el campo 'file' este oculto y que quede en su lugar un campo de texto con su boton a un lado (emulando en apariencia el campo 'file') esto para poder cambiar el texto, apariencia y disposicion del botón que lanza el dialogo de 'elejir archivo' en vez del clasico 'Examinar...' le pueda poner 'Seleccionar...' o alguna otra palabra.

Entonces el boton 'Seleccionar...' debe activar el campo 'file' que esta oculto y a su vez la ruta debe pasar al campo de texto para que la ilusion sea completa.

Aqui colge el ejemplo que por ahora solo funciona en IE http://hieloverde.com/prueba.php

Saludos,

[hieloverde]

Alguna idea de como hacerlo?

Solo quiero saber cual es el substituto de click() para firefox, es lo unico que no funciona.

O si hay una solución en algun lado para esto, favor de indicarme donde...

Saludos,

[Panino5001]

Decime si esto es lo que necesitás:

http://www.quirksmode.org/dom/inputfile.html

[hieloverde]

Gracias Panino5001 lo probare y luego te comento el resultado...

Saludos,

[Raya2]

este hilo estaba muerto pero ahi que decir que estos scripts no funcionan los probe todos.
cabe decir que el de la pagina http://www.quirksmode.org/dom/inputfile.html funciona ahi pero no lo logre implementar

[Panino5001]

Con css puede hacerse sin problemas. No obstante, a partir de Flash 8 existe la clase flash.net.FileReference, que te permite sustituir un campo tipo file con todas sus funcionalidades y darle el aspecto visual que necesites, con la ventaja adicional de que facilita la inclusión de indicadores de progreso del upload sin que sea necesario instalar librerías especiales en el servidor.

[cvelezm]

Hola amigos aquí tienen una solución consiste en registrar el evento y listo, a mi me funciono espero les funcione a ustedes también.

recuerden que tienen que hacerlo después de la creación del árbol del DOM es decir dentro de un window,onload

HTMLElement.prototype.click=function(){
var evt = this.ownerDocument.createEvent('MouseEvents');
evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
this.dispatchEvent(evt);
}