AJAX+STRUTS Presentación para la asignatura de doctorado: Desarrollo de Aplicaciones para la Web Rosa María Torres de Paz.

Slides:



Advertisements
Presentaciones similares
-go Verbs There is a small but very important group of verbs that we call the -go verbs. These verbs are: Conocer : to know (people) Hacer: to make/do.
Advertisements

-go Verbs There is a small but very important group of verbs that we call the -go verbs. These verbs are: Hacer: to make/do Poner: to put Decir: to say.
-go Verbs There is a small but very important group of verbs that we call the -go verbs. These verbs are: Hacer: to make/do Poner: to put Salir: to leave.
Juan Fernández Rodríguez
______________________ ¿Qué hay en tu insti? L/O: To use the imperfect tense to compare primary school with secondary school. Para empezar: cambia una.
E-I Pedir ayuda = To ask for help -Yo pido ayuda en la clase -Tu pides ayuda en la casa -Juancho pide ayuda todos los dias -Nosotros pedimos ayuda -Ellos.
Pronombres de objetos directos … …dónde los ponemos y como los usamos.
GUSTAR (and similar verbs). EXLPANATION GUSTAR is not conjugated like other regular verbs. It is NEVER used in the “yo”, “tú”, or “nosotros” forms. When.
Programación orientada a objetos
Español 1 – el cuatro de diciembre  We practiced two ways of asking what you need (or don’t need), and what you have (or don’t have) in class today. READ.
English Lesson 5.
Question words question WORDS? Cómo Cuándo Cuánto Dónde Por qué Qué Cuál Quién A qué hora Adónde.
-go Verbs There is a small but very important group of verbs that we call the “-go” verbs. These verbs are: Hacer: to make/do Poner: to put Salir: to.
Spanish 4/4 Honors. Háganlo ahora Form the past participle (ado, ido). Remember, there are irregular past participles too. 1. Hablar 2. Tener 3. Escribir.
Telling Time.
It is in giving that we receive, It is in pard’ning that we are pardoned And it is in dying that we are born to eternal life Mientras más das, recibiras.
SP1 19/9/11. Hoy: We will learn how to ask about the weather A variety of ways to respond to that question Look at pictures and forecasts and describe.
AJAX Daniel Montenegro Cordero Ingeniería de Sistemas y Computación Pontificia Universidad Javeriana - Cali.
Ajax en 3 Capas Ing. Pedro Luis Rodriguez. El Cliente/Servidor WEB Cliente: Navegador WEB. Internet Explorer, Mozilla FireFox Cliente: Navegador WEB.
Time Expression with Hacer Grammar Essential #106.
Objetivo: Which form of the verb should we use? Are we pronouncing the vocabulary correctly? Hagan Ahora: El papel de APT P. 69, Actividad 2.
Gender… To determine if a word is masculine look at the ending. If it ends with l,o,n,e,r,s then it’s probably masculine papel papel Carro Carro Calcetín.
ANTE TODO In both Spanish and English, conjunctions are words or phrases that connect other words and clauses in sentences. Certain conjunctions commonly.
REFLEXIVE VERBS Ch Reflexive verbs are used to talk about an action that the same person is BOTH doing AND receiving. -It is like looking in the.
Hoy es miércoles, el 11 de diciembre
Leading in Learning – Spanish Collective Memory. Plenary 1 Did you know any of the words already? If so, which? Why are the colours significant do you.
SPONGE ANSWER IN ENGLISH 1.WHICH SEASON DO LATINOS PREFER? 2.WHAT SPORTS DO THEY PREFER?
El uso del artículo como sustantivo
Hoy es el 1º de noviembre Please turn in your homework to the sub. Please complete this hand out entirely and turn in to the sub. Calentamiento: Complete.
Agenda del día 1.(~10 minutos?) Anuncios, sillas asignadas, (repartir las copias de Más práctica en algunas clases), etc. 2.(10-15 minutos) La práctica.
First Grade – High Frequency Word Reading Competition Classroom Competition Created by: Malene Golding School Improvement Officer: Kimberly Fonteno.
Telling Time La hora. Telling Time To ask what time it is in Spanish, ask: ¿Qué hora es? To answer: Es la una… (12:31 – 1:30) or Son las (hour). (1:31.
Hoy es viernes, el 26 de septiembre
Why do you need to learn English?  Schedule: Saturday: 8 a.m – 2:00 p.m – P609  Course book:  New Framework 2 pre-intermediate (units 1-6) - Richmond.
Unit 2A: Lesson 2 How to Talk About Your Schedule Gramática- Present tense of –ar verbs.
Making Words Plural. cartel-cartelescruz-cruces libro-librosflor-flores luz-lucessilla-sillas papel-papelesdulce-dulces 1. If a word ends with a vowel-----add.
Rewrite the dialogue into a logical order. Encantado Adiós Soy de Bolivia Hasta luego ¿Cómo te llamas? ¿De dónde eres? Buenos días Igualmente Me llamo.
Mi dormitorio My bedroom
Definite & indefinite articles
Imperfect Tense -AR Verbs. Notes  In Spanish there are two simple past tenses: the preterite and the imperfect.  The preterite is used to state an action.
SPANISH 7 TH GRADE With Señorita Hall Classes #6-10 – September 2013 Capítulo 1: Lectura extra ● ¡Hola! Fill out the “what happened in the READING from.
Formal Commands! Telling people what to do…… You speak, or you are speaking……Hablas, estás hablando This is different from telling (commanding) someone.
Do Now What are some Spanish words you already know? Do any of them resemble English words? Get out your Do Now Sheet!
Gustar, Aburrir, y Interesar
Bienvenida ALC 135 Miércoles el 13 de abril. objetivo Yo puedo presentar el ppt de la Semana Santa.
Answering Questions.  If a question does not have a question word, it is a yes/no question. Answer with sí or no.  If the question asks “you,” answer.
Portafolios E E- Portfolios What is - Qué es e-portfolio? e-Portfolio: A portfolio is a collection of work developed across varied contexts over.
Hoy es miércoles el veinte de noviembre AHORA With which subject pronoun would you replace each of the following? 1.Talking to one of your friends 2.Talking.
Objectives To learn some different techniques to help you memorise your ‘Healthy Living’ Written Controlled Assessment. To practise these techniques and.
-go Verbs There is a small but very important group of verbs that we call the “-go” verbs. These verbs are: Conocer : to know (people) Hacer: to make/do.
I can… Listen and respond to questions in L2 Review concepts from Spanish 1 Recognize when to use SER or ESTAR Use SER/ESTAR in context Recognize when.
ALC 68 Hoy es martes el 27 de marzo de 2012 Hay 12 preguntas para la bienvenida. If you have not done the bienvenida yet, you need to make a new flash.
Overclipping It’s very important as a trader that you understand your clip size and what positions this allows you to have. In addition it will help you.
REFLEXIVE VERBS IN SPANISH Pregunta esencial: How do I use relfexive verbs with their pronouns to talk about what people do for themselves.
The Present Continuous!!! You are loving this tense already.
ECOM-6030 PASOS PARA LA INSTALACIÓN DE EASYPHP Prof. Nelliud D. Torres © - Derechos Reservados.
If you won the lottery, what would you do?
INTRO. TO LAW – MR. STILLMAN 12/2/15 AIM: How do we construct a brilliant BILL OF RIGHTS PROJECT? DO NOW: Which Amendment will you choose for your project?
Antes de empezar – ¿Cómo se llaman estos quehaceres? (Necesito la tarea.)
-go Verbs There is a small but very important group of verbs that we call the “-go” verbs. These verbs are: Hacer: Poner: Salir: Tener : Traer: Venir:
Forming Questions ¡Aprenda! Forming Questions By Patricia Carl October 2013.
El Objeto Directo Direct Object Pronoun Sra. Altamirano.
Verbs like Gustar Notes/ Examples.
Essential question: How do I conjugate these new verbs and use them?
 Indirect Object Pronouns Indirect vs. Direct and mixing them together. It can get confusing. Let’s look at indirect object pronouns first, and then try.
Welcome! Conversation Classes. Remembering Names Everyone Stand! Introduce yourself to class and give your name an action! Go around the class and try.
Gustar V. Encantar.
First Grade Dual High Frequency Words
Seguridad Web Ing. Elieser Estrada Rodríguez. Contents Click to add Title
Fundamentals of Web Development - 2 nd Ed.Randy Connolly and Ricardo Hoar Fundamentals of Web DevelopmentRandy Connolly and Ricardo Hoar © 2017 Pearson.
Transcripción de la presentación:

AJAX+STRUTS Presentación para la asignatura de doctorado: Desarrollo de Aplicaciones para la Web Rosa María Torres de Paz

Objetivos Estudio de Ajax. Utilización de XML como medio de intercambio de datos. Estudio de Struts. Utilización de la mayor independencia y robustez arquitectónica posible. Unificación de ambas tecnologías. Posibilidades dentro de un punto de vista de reutilización. Adaptación de un sistema existente.

Localización Web 2.0 Democratización Rich user experience (RIA: Rich Internet Applications) Servicios

Evolución Web 1.0 Personal Websites /News Groups Popups Web Directories Web Classifieds Terraserver mp3 Web 2.0 Blogging - Roller RSS – Syndication Google Ad Delici.io.us HousingMaps.co m Google Maps Web 1.5 Wikis Discussion Forums Popunders Yahoo Cragislist MapQuest Napster

Focalización Rich User Experience * Aplicaciones Web como si de escritorio se trataran * El programa debe responder intuitivamente y rápidamente. * Las respuestas a eventos deben ocurrir naturalmente * AJAX es una de las tecnologías RIA (DHTML, JavaWebStart, etc)

AJAX DHTML más Comunicación Asíncrona gracias al objeto XMLHttpRequest. Pros Lleva el concepto RIA tan lejos como puede. Espectacular acogida por parte del mundo empresarial. Desarrollo de varios toolkit y framework. Separación de la presentación y búsqueda de información. Contras Incompatibilidad de browsers. JavaScript es bastante difícil de mantener y depurar. Especial cuidado con la usual navegabilidad.

Modelo

Esquema general

Modelo de Interacción:nuestra solución Cart.js Ajax.js Clase servidora AñadirAlCarrito UpdateCart newXMLHttpReque st getReadyStateHandler var req = newXMLHttpRequest(); req.onreadystatechange = getReadyStateHandler (req, updateCart); 3 req.open("POST","carro.do", true); req.send("action=add&item="+itemCode); 4 responseXmlHandler(req.responseXML); 2’

Modelo de Interacción:nuestra solución Cart.js Ajax.js Clase servidora AñadirAlCarrito UpdateCart newXMLHttpReque st getReadyStateHandler var req = newXMLHttpRequest(); req.onreadystatechange = getReadyStateHandler (req, updateCart); 3 req.open("POST","carro.do", true); req.send("action=add&item="+itemCode); 4 responseXmlHandler(req.responseXML); 2’ function newXMLHttpRequest() { var xmlreq = false; if (window.XMLHttpRequest) { xmlreq = new XMLHttpRequest(); } else if (window.ActiveXObject) { try { xmlreq = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e1) { try { xmlreq = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e2) { xmlreq = false; } } return xmlreq;

Modelo de Interacción:nuestra solución Cart.js Ajax.js Clase servidora AñadirAlCarrito UpdateCart newXMLHttpReque st getReadyStateHandler var req = newXMLHttpRequest(); req.onreadystatechange = getReadyStateHandler (req, updateCart); 3 req.open("POST","carro.do", true); req.send("action=add&item="+itemCode); 4 responseXmlHandler(req.responseXML); 2’ function getReadyStateHandler(req, responseXmlHandler) { return function () { if (req.readyState == 4) { if (req.status == 200) { responseXmlHandler(req.responseXML); } else { alert("HTTP error "+req.status+": "+req.statusText); }

Modelo de Interacción:nuestra solución Cart.js Ajax.js Clase servidora AñadirAlCarrito UpdateCart newXMLHttpReque st getReadyStateHandler var req = newXMLHttpRequest(); req.onreadystatechange = getReadyStateHandler (req, updateCart); 3 req.open("POST","carro.do", true); req.send("action=add&item="+itemCode); 4 responseXmlHandler(req.responseXML); 2’ public String toXml() { StringBuffer xml = new StringBuffer(); xml.append(" \n"); xml.append("<cart generated=\""+System.currentTimeMillis() +"\" total=\""+getCartTotal()+"\">\n"); for (Iterator I = contents.keySet().iterator() ; I.hasNext() ; ) { Productosros item=(Productosros)I.next(); int itemQuantity =((Integer)contents.get(item)).intValue(); xml.append(" \n"); xml.append(" "); xml.append(item.getNombre()); xml.append(" \n"); xml.append(" "); xml.append(itemQuantity); xml.append(" \n"); } xml.append(" \n"); return xml.toString(); }

Modelo de Interacción:nuestra solución Cart.js Ajax.js Clase servidora AñadirAlCarrito UpdateCart newXMLHttpReque st getReadyStateHandler var req = newXMLHttpRequest(); req.onreadystatechange = getReadyStateHandler (req, updateCart); 3 req.open("POST","carro.do", true); req.send("action=add&item="+itemCode); 4 responseXmlHandler(req.responseXML); 2’ function updateCart(cartXML) { var cart = cartXML.getElementsByTagName("cart")[0]; var generated = cart.getAttribute("generated"); if (generated > lastCartUpdate) { lastCartUpdate = generated; //Nos vamos a la capa id="contents" var contents = document.getElementById("contents"); var contents2=document.createElement("ul"); var items = cart.getElementsByTagName("item"); for (var I = 0 ; I < items.length ; I++) { var item = items[I]; var name = item.getElementsByTagName("name")[0].firstChild.nodeValue; var quantity = item.getElementsByTagName("quantity")[0].firstChild.nodeValue; var code=item.getAttribute("code"); var listItem = document.createElement("li"); listItem.appendChild(document.createTextNode(name+" x "+quantity));

Funciones:Cart.java private HashMap contents=new HashMap(); public void addItem(String itemCode) { Catalog catalog = new Catalog(); if (catalog.containsItem(itemCode)) { Productosros item=catalog.getItem(itemCode); int newQuantity = 1; if (contents.containsKey(item)) { Integer currentQuantity = (Integer)contents.get(item); newQuantity += currentQuantity.intValue(); } contents.put(item, new Integer(newQuantity)); }

Objetivos Estudio de Ajax. Utilización de XML como medio de intercambio de datos. Estudio de Struts. Utilización de la mayor independencia y robustez arquitectónica posible. Unificación de ambas tecnologías. Posibilidades dentro de un punto de vista de reutilización. Adaptación de un sistema existente.

Struts JAKARTA STRUTS Cavaness, Chuck (Ed. Anaya Multimedia) ISBN: ª edición Fecha Publicación: Junio 2005

Struts

¿Y ahora? Comprensión y prueba de AJAX Interacción con un servlet ¿Qué posibilidades hay de integración con struts? Estudio y prueba de struts

Fuente Using AJAX in Your Struts Application The chances are that if you are reading this article, then you are interested in AJAX's ability to create dynamic web interfaces and would like to know how to add it to a Struts application. What are your options if you want to do this? Wait until the next version of Struts (Shale) incorporates AJAX techniques. For Struts developers starting a new application this is probably the best option. The downside is that this will probably require moving to JavaServer Faces--not a bad thing in itself, but this may entail fundamental changes if you have an existing application. You could move to a new approach, like Direct Web Remoting (DWR) or Ruby on Rails, which are specifically built for AJAX applications. While these are both very impressive frameworks, and are worth taking a look at if you wish to consider web development without Struts, this option would mean rewriting your entire application.Direct Web Remoting (DWR)Ruby on Rails Add AJAX to your existing Struts application. Since AJAX is a technique, not a framework, it is straightforward to add it to Struts. For existing applications where stability (e.g., keeping existing libraries) is important, this option is recommended and is the one we explore in more detail. struts-webapp.html?page=1

Problema Al contrario que el ejemplo, quería XML y sobreescribir la parte afectada de la página Soluciones 1) El action hace un forward a la página jsp que me genera el XML de respuesta index.htmlservlet xml html js DOM S C.jsp actionactualiza.jsp html js DOM xml

Soluciones 2) Se hace una llamada a un servlet. Mapeo independiente en el web.xml 3) Se consigue la integración realizando un forward null del action Ese action es el “servlet” que maneja la comunicación asíncrona req.open("POST", "CarritoServlet.ajax", true); action *.do CarritoServlet *.ajax

Solución action *.do volver

Otros aspectos Utilización de Tiles para una mayor independencia de la presentación defaultLayaout.jsp (defino la disposición de la página Fijo una cabecera, contenido y pie)

Otros aspectos template.jsp (va a ser la plantilla a utilizar por todas las páginas, se vincula a la página anterior) Templatecliente.jsp diagrama

Otros aspectos Utilización de la validación de los formularios con Javascript de la la clase DynaValidatorActionForm. Son además dinámicos. Se realiza con la inserción de un plug-in. struts-config.xml <set-property property="pathnames" value="/WEB-INF/validator-rules.xml,/WEB-INF/validations.xml"/> alta.jsp validations.xml

Otros aspectos Realización del modelo de BD y clases JAVA con las herramientas de soporte del JDeveloper. ¿Ver la aplicación?

Objetivos Estudio de Ajax. Utilización de XML como medio de intercambio de datos. Estudio de Struts. Utilización de la mayor independencia y robustez arquitectónica posible. Unificación de ambas tecnologías. Posibilidades dentro de un punto de vista de reutilización. Adaptación de un sistema existente.

Gracias JAKARTA STRUTS Cavaness, Chuck (Ed. Anaya Multimedia) ISBN: ª edición Fecha Publicación: Junio e-ajax-magic-into-struts-webapp.html?page=1 j-ajax1/ php?pagina=strutsb