Botón Guardar como...

DaneelR · #1 (**permalink**) 30/12/2002, 02:33

Quería preguntar si se puede poner un botón en una página que haga la misma función que el "Guardar como..." del menú del navegador y poder guardar la página mostrada con las imagenes, css, etc.

Muchas gracias.

Yanix · #2 (**permalink**) 30/12/2002, 06:31

Espero esto te sirva...

Código:

<HTML>
<HEAD>
<script language="javascript">
function guardarcomo()
{
var WebBrowser = '<OBJECT ID="WebBrowser1" WIDTH=0 HEIGHT=0 CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>';
document.body.insertAdjacentHTML('beforeEnd', WebBrowser); 
WebBrowser1.ExecWB(4, 2);
WebBrowser1.outerHTML = "";
}
</script>
</HEAD>
<BODY>
Oprime el botón para guardar esta página...<BR>
<input type="submit" value="  Guardar  " onClick=guardarcomo() name="miboton">
</BODY>
</HTML>

Sirve IE 5.5 +
No sé si versiones anteriores.

Kaopectate · #3 (**permalink**) 30/12/2002, 07:30

Yaaaaniiixxx....¿FAQ-83?

Yanix · #4 (**permalink**) 30/12/2002, 07:45

Creo que ...
84

Kaopectate · #5 (**permalink**) 30/12/2002, 07:47

Tomaré eso como un si.

Yanix · #6 (**permalink**) 30/12/2002, 08:38

si

DaneelR · #7 (**permalink**) 31/12/2002, 01:48

El script está muy bien, gracias, pero solo guarda el html, si la página contiene imagenes o css no los guarda, ¿se podría hacer que la opción que abriera el botón fuera la misma acción que tiene en el menú del navegador Archivo->Guardar como..., en esta se guarda la página entera con las imágenes y los css.

Muchas gracias y un saludo.

Yanix · #8 (**permalink**) 31/12/2002, 06:18

Claro..perdona.

Donde dice:
WebBrowser1.ExecWB(4, 2);
Cámbiale el 2 por un 0. Así te guardará la web como un todo y no solo como un HTML o texto.

DaneelR · #9 (**permalink**) 02/01/2003, 01:27

Muchas gracias Yanix, ¿podrías explicarme la función?, es que no encuentro documentación sobre javascript para comprender su fucionamiento.

Yanix · #10 (**permalink**) 02/01/2003, 08:19

Claro.
Ok...veamos.

Aquí utilizamos un objeto en nuestro javascript. Por eso es que ves los tags de OBJECT. Classid es la foma de llamar o implantar ese objeto. Aunque casi siempre es una web o link que contiene el objeto lo que se utiliza, ocurre algo distinto en este caso pues este objeto al ser parte de las funciones o controles en el navegador, se le llama asi.

El ExecWB (la verdad no sé si sea por Execute WebBrowser) lo que hace es pasar los comandos para ejecutarlos en el navegador (comandos OLE). El primero (el 4) es para llamar y ejecutar ese comando del objeto. En este caso el 4 es 'guardar como'. Si lo reemplazas por 1 , verás que saldrá el diálogo para abrir un documento. Si lo reemplazas por 6 , verás el diálogo para imprimir. Si lo reemplazas por el 7 , verás el 'print preview'. Si lo reemplazas por 17 , verás que hace un 'select all', y así sucesivamente existen distintos tipos de comandos OLE para enlazar el objeto, que ahora toda esa nomenclatura de OLE la han ido agrupando como Activex. (extensión de tecnología OLE)

El webbrowser1.outerhtml=""; lo puedes eliminar...Correccion - no eliminarlo por ahora para que no caiga el error en javascript. Estaba añadiendo una función para recolectar posibles errores, y no la he continuado. A la variable WebBrowser le puedes cambiar el nombre, pero recuerda cambiarlo también en el paréntesis que le hace referencia. Lo mismo con el nombre WebBrowser1 . Estos los dejé para seguir con la misma línea del formato que otros códigos y programadores utilizan para la declaración y llamada de los objetos.

Luego...en la parte del BODY se crea el botón. y se le asigna la función guardarcomo() en onclick . Esto es, cuando el usuario presione el botón, la función se ejecutará. Igualmente, se pudo haber hecho mediante un vínculo y no un botón, pero eso es a preferencia y discreción del desarrollador

Espero haber sido útil y haya servido la explicación y el vínculo en ActiveX...porque en unos años quiero ser profesora tambienl lalalala

evoarte · #11 (**permalink**) 02/01/2003, 10:46

Excelente aportación,

Sin embargo, con IE6 tengo problemas, continuando con el ejemplo inicial, cuando cancelo guardar, me tira un error javascript, indicándome que el comando no es compatible.

Salu2.

Yanix · #12 (**permalink**) 02/01/2003, 11:32

Gracias por la observacion...Lo tengo, creo que te refieres a que cuando se le da Cancel y se oprime nuevamente el botón de guardar, éste deja de funcionar y hay que hacer un refresh a la página para que funcione nuevamente..es eso?

Al menos con IE 5.5 el error me da cuando le doy cancel e intento oprimirlo nuevamente.. Si es eso, entonces no quites lo del WebBrowser1.outerHTML = ""; para que se destruya el objeto y lo recree cada vez que se oprime el boton al llamar la función. Y deja el segundo parametro como 0 que es el que viene por defecto o inicio. Pero yo queria tomarlo como una cadena con el outer encadenandolo en algun error...Si no es eso, por favor avísame para asi seguir puliendo el código. Porque lo que tengo aca es IE 5.5

Gracias evoarte.

--
Pero si lo que deseas es solamente que lo guarde como HTML, puedes usar el execCommand...

Código:

<html>
<head>
<script>
function guardahtml ()
{
   document.execCommand('SAVEAS')
}
</script>
</head>
<body>
<form>
<input type='button' value="Guardar html" onclick="guardahtml();">
</form>
</body>
</html>

Si se desea que aparezca automaticamente algun nombre en la caja de dialogo cuando se va a guardar, entonces se modifica a:

Código:

<html>
<head>
<script>
function guardahtml (algo)
{
  document.execCommand('SAVEAS',null,algo)
}
</script>
</head>
<body>
<form>
<input type='button' value="Guardar html con nombre que yo quiera al inicio" onclick="guardahtml('algunnombreparaguardarlo');">
</form>
</body>
</html>

Agradeceré me avises si funciona en IE 6, para sino..seguir puliendo más el código.

evoarte · #13 (**permalink**) 02/01/2003, 13:06

Efectivamente, Yanix.

La configuración correcta para IE6, y "guardar como", es la que has indicado:

WebBrowser1.ExecWB(4,0);

Salu2.

Yanix · #14 (**permalink**) 02/01/2003, 13:38

Gracias evoarte por hacer la prueba.
(Post anterior modificado para evitar error de versión.)

evoarte · #15 (**permalink**) 02/01/2003, 15:57

Para no tener que ir probando,

¿ Cómo puedo conocer todas las combinaciones ?

Salu2.

Yanix · #16 (**permalink**) 02/01/2003, 16:30

Aquí están los OLE commands en la tabla abajo (alrededor de 37). Claro, algunos no funcionan para lo que queremos porque se utilizan para otras aplicaciones, no para browser.

Kaopectate · #17 (**permalink**) 02/01/2003, 16:35

Yanix, súbela un poco que no la veo...

Yanix · #18 (**permalink**) 02/01/2003, 16:42

Jaaaaaaaaajaja

Perdon..

Le di Enviar antes de escribirla

Entiendanme...es que ya voy saliendo del trabajo y mañana tengo dia libre

Aqui!
Aqui!
Aqui!
Aqui!
Aqui!
Aqui!
Aqui!
Aqui!

Ahora sí la vieron

Puskas · #19 (**permalink**) 07/02/2008, 13:20

como hacer para guardar jpg en vez de html????

Puskas · #20 (**permalink**) 07/02/2008, 13:27

Hola, lo siento he entrado como una moto y no sé muy bien como funciona esto. A mi ste codigo me ha funcionado fenómeno pero el caso es que me guarda el html y yo necesito que me guarde los jpg.

Zen kius