logo El diario de Pepe Molina (Caricatos)

yo

En ocasiones tenemos que realizar operaciones que implican cierto riesgo de alteración de datos y se nos ocurre que podría ser buena idea volcarlos a un fichero que pueda servirnos para recuperarlos si algo falla.

Última caricatura

IV Asamblea de la AEC: IV Asamblea General de la Asociación Española de Caricaturistas

IV Asamblea de la AEC

RSS de las imágenes: rss

La Cita

Una idea es verdad cuando aún no se ha impuesto

Eugene Ionesco, dramaturgo francés de origen rumano (1912-1994).

En esta zona están las páginas personales del autor.

Mis clientes ahora también son mis amigos (aunque les cobre).

En Mis amigos Informáticos hay una pequeña colección de páginas de colegas webmasters..

En Mis amigos artistas podemos encontrar artistas de cualquier índole (dibujantes, pintores, escritores...)

Las recomendaciones que proponemos son de índole variada.

Aquí un cajón de sastre de enlaces.

Nos referencian desde sitios de toda índole.

Puede contribuir a mantener esta página con su donativo.


botón pay-pal

XML para guardar tablas

emoticón de Caricatos Publicado el día 04 de noviembre de 2012
id=100; categorías: Vicisitudes de un Webmaster, Programación

webmasterEn ocasiones tenemos que realizar operaciones que implican cierto riesgo de alteración de datos y se nos ocurre que podría ser buena idea volcarlos a un fichero que pueda servirnos para recuperarlos si algo falla. También podríamos utilizar esos mismos datos para transferir esa información a otro soporte (algún disco local, por ejemplo); entonces el formato que se nos antoja adecuado es una estructura "XML".

Nuestro caso: Los apuntes

Para nuestro caso concreto, vamos a volcar la tabla de apuntes, pero solo nos interesan los título con sus respectivos contenidos, descartando la fecha y demás campos que para nuestro propósito son innecesarios, aunque viendo el código puede apreciarse con que facilidad podríamos insertar más campos.

Para la creación del nuevo documento usaremos código PHP: 

$cabeza =<<< cabecera
<?xml version="1.0" encoding="ISO-8859-1" ?>
<?xml-stylesheet type="text/xsl" href="diario.jocker.php?extra=apuntes_xsl" ?>
<apuntes>

cabecera;

$lista = "";

$sql = "select id, titulo, apunte from $tabla_apuntes order by fecha desc"; 
$res = @mysql_query($sql); 

while ($dato = mysql_fetch_array($res))    {
	$id = $dato["id"];
	$titulo = $dato["titulo"];
	$apunte = $dato["apunte"];
	$lista .= "<apunte>\n\t";
	$lista .= "<id>$id</id>";
	$lista .= "<titulo><![CDATA[$titulo]]></titulo>";
	$lista .= "<texto><![CDATA[$apunte]]></texto>";
	$lista .= "\n</apunte>\n";
}

$apuntes = "$cabeza\n$lista\n</apuntes>\n";
file_put_contents("apuntes.xml", $apuntes);

Para poder comprobar que el resultado es correcto, hemos asociado una hoja de estilos XSL y ya podemos enlazarlo (posiblemente no actualizaremos este fichero constantemente).

Ajax al rescate

Ya hemos hablado de la "x" de Ajax: Ajax, con X de XML, y en este caso no es necesario leer un documento creado dinámicamente. Nuestra página leerá al iniciarse el fichero mencionado, volcándolo en una capa que hemos identificado como "listado" (id="listado"). 

window.onload = function() {
	url = "apuntes.xml";
	Ajax = objetoAjax();
	Ajax.open("get", url, true);
	Ajax.onreadystatechange = function()	{
		if	(Ajax.readyState == 4 && Ajax.status == 200) {
			nueva_capa = document.createElement("ul");
			respuesta = Ajax.responseXML.documentElement;
			apuntes = respuesta.getElementsByTagName("apunte");
			for (i = 0, total = apuntes.length; i < total; i++)	{
				titulo = apuntes[i].getElementsByTagName("titulo")[0].firstChild.nodeValue;
				apunte = apuntes[i].getElementsByTagName("texto")[0].firstChild.nodeValue;
				id = apuntes[i].getElementsByTagName("id")[0].firstChild.nodeValue;
				capas[id] = {"estado": false, "apunte": apunte};
				f = "<div><input type='checkbox' id='c_" + id + "' name='ap' value='ap_" + id + "'/> ";
				f += "<span style='cursor: pointer' onclick='plegar(" + id + ")'>" + titulo + "</span>";
				f += "<form action='apuntar.php' method='post' target='ventana'";
				f += " id='f_" + id + "'>";
				f += "<input type='hidden' name='id' value='" + id + "'/>";
				f += "<input type='hidden' name='titulo' value='" + titulo + "'/>";
				f += "<fieldset><legend> " + titulo + " </legend>";
				f += "<textarea name='apunte' style='width:100%; height: 200px'></textarea>";
				f += "<button type='submit' style='text-align: center; width: 100%;'> actualizar </button>";
				f += "</fieldset>";
				f += "<div id='v_" + id + "' class='prever'>";
				f += "<button type='button' onclick='prever(" + id + ")'>prever";
				f += "</button></div>";
				f += "</form>";
				tag("listado").innerHTML += f;
			};
			tag("cargando").src = "si.gif";//	cargando => cargado
		}
	}
	Ajax.send();
}

Si analizamos este código podemos encontrar cosas de difícil comprensión, que trataremos de explicar a continuación.

Volcado incompleto y objeto "capas"

Si bien generamos un elemento "textarea" con el nombre "apunte" (name="apunte"), y una capa "div" con la clase "prever" (class="prever"), podemos ver que no lleva contenido alguno en el primero de los casos, y que parece tratarse del valor asociado a la etiqueta apunte del fichero leído; y en el segundo caso, tan solo hay un botón con la leyenda "prever", y que tiene como parámetro el identificador "id" del apunte.

Las razones son: para el primero de los casos que realmente no se muestra el contenido ya que el formulario está oculto y que se despliega pulsando sobre su título. De todos modos en el objeto "capas" guardamos cada apunte asociado a su id, así que a la vez que desplegamos el apunte asignamos ese valor al elemento textarea: 

function plegar(f)	{
	if (document.forms["f_" + f].apunte.value == "")
		document.forms["f_" + f].apunte.value = capas[f].apunte;
	tag("f_" + f).style.display = (capas[f].estado) ? "none":"block";
	capas[f].estado = !capas[f].estado;
}

Si hubiéramos intentado incluir los contenidos al obtenerlos mediante Ajax, podríamos tener problemas por las etiquetas que tienen los apuntes, porque se podrían cerrar algunas existentes o añadidas como los "div" y "textarea". Y si incluyésemos los contenidos se deberían cargar muchos elementos que ralentizarían demasiado la carga de la página.

Así es la función prever: 

function prever(f){
	tag("v_" + tag("id_" + f).value).innerHTML = document.forms["f_" + f].apunte.value;
}

Evidentemente los cambios solo serán posibles en el modo administrativo. Aquí el resultado (nótese que cada apunte puede considerarse un probador de código modificando el contenido y pulsando el botón "prever").

Zona de comentarios

Este apunte aún no tiene comentarios.

Evaluación

Valoración de esta página: (apunte.100) valor

Valoración evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar

Respuesta: Zona de mensajes (proceso de evaluación)

Historial de navegación

Esta página ha sido visitada en 7922 ocasiones

Disponemos de rss sindicar

Y del Mapa del sitio, además del sitemap.xml.

Aquí podemos encontrar los apuntes más visitados.

"Top 10" reemplaza a la sección Últimos apuntes.

Una buena forma de buscar un apunte es a partir de su categoría.

También es posible buscar apuntes por medio de las etiquetas (tags).

Hemos decidido poner al alcance de todos algunos comodines.

Adjuntamos una versión reducida del "buscador interno" que vemos en la lista anterior:

Buscar en apuntes

También estamos recopilando antiguas páginas del sitio.

Desde este recuadro se puede hacer una búsqueda cronológica.

Se puede crear una postal nueva desde el enlace del sector "Otras páginas del dominio", o editar la que sale en el recuadro, pulsando sobre ella..

http://www.pepemolina.com/postales/Fondos/santa.gif
http://www.pepemolina.com/postales/animales/gato8t.gif
Feliz Navidad
Feliz Navidad
enlace a la postal
Copyright © 2002-2024 www.pepemolina.com
RSS rss | Ver Mapa del sitio