Editando apunte: Top 10 con Ajax (paginación)

Editando apunte: Top 10 con Ajax (paginación) cerrar apuntes

ID: 86 (tabla: apuntes) Título:
Fecha: [poner fecha actual ]
Categorías: Vicisitudes de un Webmaster, Programación
Etiquetas: accesibilidad, bitácora, blog, diario, enlaces, javascript, links, php, webmaster
Extras: accesibilidad, bitácora, blog, diario, enlaces, javascript, links, php, webmaster
apunte: - - - - - - - -

<p>
	[rss]Últimamente hemos modificado la página para mostrar los apuntes creados cada mes en la sección archivos, por lo que la sección "Últimos apuntes" tiene ahora poco sentido mantenerla.
	Por otro lado, en otro <a href="?titulo=Este+diario%3A+Extras&PHPSESSID=q80orfu9as01j4glmsika5sit2">apunte</a> hemos mostrado los 10 apuntes más leídos del diario, y hemos pensado que es lo que podría sustituir la sección antes mencionada.[/rss]
</p>
<p>
	Nos basaremos en la misma instrucción <a href="http://es.wikipedia.org/wiki/SQL">sql</a>:
</p>

<div class="codigo">
		$sql = "select a.titulo as tit, a.id as idd, b.cuenta as cuen from $tabla_apuntes as a inner join $tabla_contadores as b on concat('apunte.', a.id)=b.pagina order by b.cuenta desc limit 0, 10";
</div>

<p>
	Donde recibimos los diez apuntes más leídos junto a su id (identificador) y el número de veces leído.
</p>

<h3 class="subtitulo">
	Después de "cortar y pegar"...
</h3>
<p>
	Evidentemente tal como hemos hecho para mostrar la instrucción sql (copiar y pegar... seguro que lo habían adivinado), reutilizaremos esa instrucción, pero con pequeñas modificaciones.
</p>
<p>
	Al tratarse de una paginación, esa instrucción solo tendría sentido para la primera página, pero tendrá que haber más, y las páginas deberán ser del tipo pag=n.
	Entonces la línea sql deberá estar limitada por una variable: "limit $inicio, 10"... o mejor "limit $inicio, $cuantas"; y para recibir los parámetros se nos ocurre que deberá ser así: 
</p>

<pre class="codigo" >$ini = (isset($_GET["pag"])) ? $_GET["pag"] - 1 : 0;
$cuantas = (isset($_GET["cuantos"])) ? $_GET["cuantos"] : 10;
$inicio = $ini * $cuantas;
if ($inicio < 0)	$inicio = 0;</pre>

<p>
	[rss]Otra modificación que hemos realizado es obtener el resumen al igual que hemos hecho con el apunte anterior.
	Tan solo falta saber cuántas páginas habrá, o aún mejor, cuántos apuntes... ¡Ya tenemos dos motivos para realizar consultas "Ajax"![/rss]
</p>
<p>
	A continuación reservamos el espacio para nuestro propósito: una capa para el listado y abajo un pequeño menú de navegación con las páginas disponibles.
</p>
<div style="margin: 1em;">
<div id="listado_tope" style="width: 80%; margin: 0 auto; border: 3px ridge blue; border-bottom: 1px solid pink; margin-top: 0; background-color: #eeeeee;">
<h4 style="background-color: aqua; margin-top: 0; padding-top: 1em;">
			Listado de los apuntes más leídos. Página: <span id="n_pagina">0</span> de <span id="total_paginas">...</span> (<span id="num_apuntes">...</span> apuntes) 
</h4>

</div>
<div id="botones_top_10" style="width: 80%; margin: auto; border: 3px ridge blue; border-top: 1px solid aqua;">
<img src="diario/dibujos/espera.gif" alt="espera" style="float: right; margin: 1em; visibility: hidden;" id="espera_top"/>
<ul id="top_paginas"><li id="top_paginas_1"><a href="diario.jocker.php?extra=top&PHPSESSID=q80orfu9as01j4glmsika5sit2">1</a></li></ul>
</div>
</div>
<p>
	La primera consulta, al cargarse la página, es averiguar cuantos apuntes tenemos y la instrucción sería:
</p>
<pre class="codigo" >	$sql = "select count(*) as total from $tabla_apuntes where activo='1'";
	$res = @mysql_query($sql);
	$total = mysql_result($res, 0, "total");
	echo $total;</pre>
<p>
	[rss]Después de obtener ese dato (el número de apuntes) obtenemos la primera de las páginas y concluímos con los ajustes finales.[/rss]
</p>

<h3 class="subtitulo">
	Últimos ajustes
</h3>
<p>
	[rss]Tan solo nos queda revisar detalles secundarios pero no menos importantes como las actualizaciones en los elementos que indican dónde estamos, ya sea enfatizando el vínculo actual (en nuestro caso hemos incrementado el tamaño de la letra/número), o actualizando ese valor en la zona informativa.[/rss]
</p>

Controles Otras tablas: imagenes, postales, categorias, etiquetas, extras - - (popup ) - que

Seleccionar nuevo apunte

categoria Nombre:
Controles Otras tablas: apuntes, imagenes, postales, etiquetas extras - - Seleccionar: categoria
Descripción: - - - - - - - -	Apuntes

extra Nombre:
Controles Otras tablas: apuntes, imagenes, postales, categorias etiquetas - - Seleccionar: extra
Descripción: - - - - - - - -	Apuntes

etiqueta Nombre:
Controles Otras tablas: apuntes, imagenes, postales, categorias extras - - Seleccionar: etiqueta
Descripción: - - - - - - - -	Apuntes

Editor del diario

Zona de comentarios

Evaluación