Учебники

Apache Tapestry — Компонент Ajax

Октябрь 19, 2018

AJAX расшифровывается как асинхронный JavaScript и XML . Это методика создания более качественных, быстрых и интерактивных веб-приложений с помощью XML, JSON, HTML, CSS и JavaScript . AJAX позволяет отправлять и получать данные асинхронно, без перезагрузки веб-страницы, поэтому это быстро.

Компонент зоны

Компонент зоны используется для предоставления содержимого (разметки), а также положения самого содержимого. Тело компонента зоны используется внутри Tapestry для генерации контента. Как только динамический контент будет сгенерирован, Tapestry отправит его клиенту, отобразит данные в нужном месте, запустит и анимирует HTML, чтобы привлечь внимание пользователя.

Этот компонент Zone используется вместе с компонентом EventLink. EventLink имеет возможность привязать его к определенной зоне, используя атрибуты t: zone . Как только зона сконфигурирована в EventLink, нажатие на EventLink вызовет обновление зоны. Кроме того, события EventLink (refreshZone) могут использоваться для управления генерацией динамических данных.

Простой пример AJAX следующий:

AjaxZone.tml 

<html t:type = "Newlayout" title = "About MyFirstApplication" 
   xmlns:t = "http://tapestry.apache.org/schema/tapestry_5_4.xsd" 
   xmlns:p = "tapestry:parameter">  
   
   <body> 
      <h1>Ajax time zone example</h1>  
      <div class = "div1">  
         <a t:type = "eventlink" t:event = "refreshZone" href = "#" 
            t:zone = "timeZone">Ajax Link </a><br/><br/> 
         <t:zone t:id = "timeZone" id = "timeZone">Time zone: ${serverTime}</t:zone> 
      </div>  
   </body>
   
</html>

AjaxZone.java 

package com.example.MyFirstApplication.pages;  

import java.util.Date; 
import org.apache.tapestry5.annotations.InjectComponent; 
import org.apache.tapestry5.corelib.components.Zone; 
import org.apache.tapestry5.ioc.annotations.Inject; 
import org.apache.tapestry5.services.Request;  

public class AjaxZone { 
   @Inject 
   private Request request; 
   
   @InjectComponent 
   private Zone timeZone; 
   
   void onRefreshPage() { 
   } 
   
   Object onRefreshZone() { 
      return request.isXHR() ? timeZone.getBody() : null; 
   } 
   
   public Date getServerTime() { 
      return new Date(); 
   } 
}

Результат будет показан по адресу: http: // localhost: 8080 / MyFirstApplication / AjaxZone

45
Share: