. .

Publicidad

Secciones

Publicidad

Aplicaciones Web

Programación

Hardware

Software

Bases de Datos

Mobile

Empresas

 

AJAX Prototype: Actualizar un div con contenido remoto

Recientemente mostrábamos un ejemplo de cómo actualizar dinámicamente un div con contenido remoto mediante el uso de JQuery para peticiones Ajax. Hoy el ejemplo tiene el mismo objetivo, pero hemos utilizado otro framework que también cumple con ese función de actualizar la página dinámicamente.

La utilización es bastante similar a la de JQuery, sobre todo si solo utilizamos de una forma básica. Cuando necesitamos realizar funciones más avanzadas (evaluar la respuesta, ejecutar una función posteriormente, etc) allí quizás difieren un poco. El ejemplo para Prototype sería el siguiente:

<html>
<head>
<title>
Ejemplo de Prototype: Actualizar Div con Contenido Remoto
</title>
<script
  type="text/javascript"
  src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.3/prototype.js">
</script>
</head>
<body>
<h1>Ejemplo Prototype: Actualizar Div con contenido remoto</h1>
<p>Click en el bot&oacute;n para actualizar
<input type="button"
value="Actualizar"
onclick="new Ajax.Updater('divActualizar', 'textollamado.html');" />
</p>
<div id="divActualizar"
style="width: 200px; height: 200px; border-style: solid; border-width: 2px;">
  Contenido del div.... [debería reemplazarse al momento de presionar el botón]
</div>
</body>
</html>

Igual que con JQuery, la idea es que el usuario pulse el botón Actualizar, y el div con id = divActualizar se actualice con el contenido dentro del archivo "textollamado.html". Cabe señalar también, que al igual Prototype también puede invocarse (ver entre las etiquetas <head>) desde la url de google code, cuando por ejemplo queremos ahorrar ancho de banda, o bien queremos cargar una versión específica compatible con nuestro proyecto.

Este ejemplo lo puedes descargar aquí.

Tags para esta entrada: AJAX PrototypeEjemplo PrototypeEjemplo AJAXEjemplo Javascript AjaxAjax FrameworkPrototype Framework



Otros temas relacionados

AJAX JQuery: Actualizar un div con contenido remoto

Uno de los aspectos más interesantes del AJAX es la posibilidad de poder actualizar elementos independientes de la página con contenido remoto. De esta forma se evitan viajes completos al servidor que significan recargar todo el contenido y por ende un desperdicio de ancho de band...... Leer el artículo completo

AJAX y Frameworks Javascript, fundamentos técnicos básicos de la Web 2.0

El Javascript tomó por asalto la Programación Web hace algunos cuatro o cinco años con el boom del AJAX (Asynchronous Javascript and XML). Ajax vino a ser una especie de revitalización para los sitios web que necesitaban mayor interacción con el usuario, puesto que...... Leer el artículo completo

Tutoriales Menús CSS: Una recopilación de los mejores tutoriales

En Sulvision encontramos un listado de los mejores tutoriales de CSS para la construcción de menús de navegación, tabs, listas, etc. En muchas ocasiones este tipo de elementos parecen algo triviales, pero al si no somos gurús de CSS podemos terminar pasando un mal rato. E...... Leer el artículo completo

Diferencia entre las etiquetas DIV y SPAN

En el pasado las etiquetas (Tags) HTML aportaban cierto significado al contenido, y es por ello que en aquel entonces se incluyeron en el lenguaje las etiquetas DIV y SPAN. Hoy, dichas etiquetas, no aportan significado alguno al contenido. La principal diferencia entre ambas es que SPAN es una ...... Leer el artículo completo