Archivo para framework

Framework Ajax: jQuery

Posted in Programación with tags , , , on 1 julio, 2009 by febrer

Según la Wikipedia:

jQuery es una biblioteca o framework de Javascript, creada inicialmente por John Resig, que permite simplificar la manera de interactuar con los documentos HTML, manipular el árbol DOM, manejar eventos, desarrollar animaciones y agregar interacción con la tecnología AJAX a páginas web.

Actualmente, jQuery es el framework Ajax más utilizado en la red. Permite de la creación de aplicaciones Ajax de una forma rápida y sencilla.

Como componente adicional, jQuery dispone de una biblioteca para la generación de interfaces de usuario, jQuery UI. Básicamente dispone de los siguientes elementos (Widgets): Accordion, Datepicker, Dialog, Progressbar, Slider, Tabs.

Estos widgets, junto con la posibilidad de utilizar efectos (Blind, Bounce, Clip, Drop, Explode, Fold, Highlight, Puff, Pulsate, Scale, Shake, Size, Slide, Transfer) e interaciones (Drag,Drop,Resize,Select,Sort) hacen de esta biblioteca una potente herramienta para el desarrollo de aplicaciones AJAX.

A continuación os dejo un ejemplo de como implementear ‘jQuery UI Tabs’ en nuestro código HTML:

<!doctype html>
<html lang="es">
<head>
 <title>jQuery UI Tabs</title>
 <link type="text/css" href="../../themes/start/ui.all.css" rel="stylesheet" />
 <script type="text/javascript" src="../../jquery-1.3.2.js"></script>   <!-- framework jQuery -->
 <script type="text/javascript" src="../../ui/ui.core.js"></script>  <!-- librería base jQuery-UI para desarrollo de interfaces -->
 <script type="text/javascript" src="../../ui/ui.tabs.js"></script>  <!-- librería para el control tabs -->
 <script type="text/javascript">
 $(function() {
  $("#tabs").tabs(); //activamos las pestañas
 });
 </script>
</head>
<body>
 
<div id="tabs">
 <ul>
  <li><a href="#tabs-1">Pestaña 1</a></li>
  <li><a href="#tabs-2">Pestaña 2</a></li>
  <li><a href="#tabs-3">Pestaña 3</a></li>
 </ul>
 <div id="tabs-1">
  <p>Contenido pestaña 1.</p>
 </div>
 <div id="tabs-2">
  <p>Contenido pestaña 2.</p>
 </div>
 <div id="tabs-3">
  <p>Contenido pestaña 3.</p>
 </div>
</div>
</body>
</html> 

 

Verdaderamente recomendable 🙂

Enlaces de interes:

240 plugins para utilizar con jQuery: http://www.kollermedia.at/archive/2007/11/21/the-ultimate-jquery-plugin-list/     
Framework base: http://jquery.com/  
Framework para la creación de interfaces de usuario:  http://jqueryui.com/

Anuncios

Mi framework

Posted in Programación, Trabajos with tags , , on 9 octubre, 2008 by febrer

Bueno, al final me he decido a escribir algo. Tengo muy abandonado el blog, en este mes pasado solo he podido escribir un post. Desde que he empezado mi nueva etapa de trabajador por cuenta ajena, no tengo ni tiempo. Por supuesto tengo que seguir atendiendo a mis clientes, y eso también me lleva bastante tiempo. Mi mujer cualquier día me deja, y con razón.

En este post quería hablar del “mini” lenguaje que utilizo para la generación de portales. Este “mini” lenguaje, me permite crear páginas personales online, rápida y fácilmente.
Dispongo de unas 80 funciones que me permiten desde realizar operaciones matemáticas, acceso a base de datos, recuperación de variables globales, etc, etc.

Este es un fragmento del código que utilizo:

<!–
%frmInicio()%
%frmPaginacion(10)%
%frmTabla(productos,familia=%frmRequest(f)%)%
–>
<table>
 %frmRepetir()%
 <tr>
 <td>Nombre: </td> <td>%frmValor(nombre)%</td>
 <td>Categoría: </td> <td>%frmCombo(categoria)%</td>
 <td>Precio: </td> <td>%frmValor(precio)%</td>
 </tr>
 %finRepetir()%
</table>
%frmLinkAnterior()% / %frmLinkSiguiente()%

Con este código, lo que hago es crear una página con el contenido de la tabla “Productos”, con la condición de que los productos se selección en base a un parámetro pasado por GET. Se establece la paginación a 10 registros por página, y en el pie de página, se muestran los controles para paginar por las diferentes páginas.

Como todas las páginas de mis portales están almacenadas en base de datos, lo que hago es interpretar el contenido antes de mostrarlo en el navegador.

Como veréis, gracias a esta utilidad de mi framework, me permite la generación de aplicaciones rápidas y efectivas.

Se admiten sugerencias.