文档章节

tapestry using ajax

z
 zhouyc
发布于 2014/06/12 14:16
字数 545
阅读 517
收藏 0

请参看tapestry的官方文档,这里只是总结性的备忘录。

http://tapestry.apache.org/ajax-and-zones.html

http://www.w3cschool.cc/jquery/jquery-dom-set.html


相关内容:

t:zone组件: 决定ajax请求完成后,更新的区域。

触发ajax请求的方式:

1) 通过组件的的事件函数,返回局部更新的内容。

   定义t:zone组件,组件参数 id 和 t:id

在下面的4个组件的事件处理方法中,返回更新的内容。component中添加zone属性,指向定义的t:zone组件。

EventLink   ActionLink Select Form

page.tml
//------------------------
<t:actionlink t:id="someLink" zone="myzone">update</t:actionlink>
<t:zone t:id="myZone" id="myzone">
    The current time is ${currentTime}
</t:zone>

page.java
//------------------------
Object onActionFromSomeLink() {
    return request.isXHR() ? myZone.getBody() : null;
}

  可以一次更新多个zone (区域的内容)

@InjectComponent
private Zone userInput;
 
@InjectComponent
private Zone helpPanel;
 
@Inject
private AjaxResponseRenderer ajaxResponseRenderer;
 
void onActionFromRegister()
{
    ajaxResponseRenderer.addRender("userInput",
        userInput).addRender("helpPanel", helpPanel);
}


2) 通过调用javascript (jquery)的ajax方式来进行调用。(和其他框架一样,内容以后补充)

通过动态创建EventLink, 通过jquery的ajax调用,实现局部刷新功能。

1)META-INF/modules/ajaxjson.js  (一定要注意路径,当初放在了assets/modules下面了,找不到js文件)

define(['jquery'], function($) {
    return {
        update : function(url) {
            $('#update').click(function() {
                $.getJSON(url,function(result){
                $("#address").text(result.address);
                $("#id").text(result.id);
                $("#name").text(result.name);
            });
            });
        }
    };
});

2)AjaxJson.java

public class AjaxJson {
    @Property
    @Persist
    private int count;
   
    @Property
    private int id;
    @Property
    private String name;
    @Property
    private String address;
    @Property
    private Date now; 
    @Inject
    private ComponentResources resources;
    @Inject
    private JavaScriptSupport javaScriptSupport;
    void setupRender() {
        now = new Date();
        id = 42;
        name = "xxxxx";
        address = "yyyyy";
    }
    
    @Inject 
    private Logger log;
    
    @AfterRender
    void afterRender() {
         Link link = resources.createEventLink("AjaxJson");
         javaScriptSupport.require("ajaxjson").invoke("update").with(link.toAbsoluteURI());
    }

    JSONObject onAjaxJson() {
        count++;
        JSONObject myData = new JSONObject();
        myData.put("id", 100);
        myData.put("name", "lichunhua" + count);
        myData.put("address", "dalian" + count);
        return myData;
    }
    
}

3) AjaxJson.tml

<html xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd"
    xmlns:p="tapestry:parameter">
    <table>
        <tr>
            <td>id</td>
            <td id="id">${id}</td>
        </tr>
        <tr>
            <td>name</td>
            <td id="name">${name}</td>
        </tr>
        <tr>
            <td>address</td>
            <td id="address">${address}</td>
        </tr>
    </table>
    <hr />
    ${now}
    <input type="button" id="update" value="AjaxJson" />
</html>

3) eventlink返回block,实现局部更新的ajax功能

 3.1)AjaxBlock.tml

<html
    xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd"
    xmlns:p="tapestry:parameter">
    <t:Zone t:id="br" id="br" />
    <t:block id="detail">
       ajax appliction from return Block ${count}
    </t:block>
    <hr />${now}
    <t:EventLink event="Ajax" zone="br">AjaxReturnBlock</t:EventLink>
</html>

public class AjaxBlock {
    @Inject
    private Block detail;
    
    @Property
    @Persist
    private int count;
    
    @Property
    private Date now;
    
   @Inject
    private ComponentResources componentResource;
      
   void setupRender() {
        now = new Date();
    }
 
    Block onAjax() {
        count++;
        return detail;
    }
}


© 著作权归作者所有

z
粉丝 2
博文 50
码字总数 15358
作品 0
大连
私信 提问
Tapestry 教程(四)探索项目结构

项目的格局遵循的是Maven倡导的一个很合适的标准: l Java源代码文件放在 src/main/java 下面 l Web应用程序文件放在 src/main/webapp(包括src/main/webapp/WEB-INF) l Java测试资源放在s...

LeoXu
2016/01/08
453
0
第三十三讲:tapestry Ajax eventlink无刷新页面

tapestry的Ajax使用非常简单,Ajax的页面无刷新,刚好解决了eventlink、actionlink等组件无刷新,这点在js应用中非常的强大。下面就于eventlink组件为例。源码如下: AJAXEventLink.java /**...

神勇小白鼠
2012/04/24
0
0
70个流行的AJAX应用程序或演示代码【转】

Ajallerix : AJAX, simple, fast Web image gallery demo ; at NovellAJAX - microlink pattern tutorial : A microlink is a link that opens up content below it.Ajax BBC News RSS Reade......

唐玄奘
2017/12/04
0
0
Apache Wicket 7.4.0 发布,Web 开发框架

Apache Wicket 7.4.0 发布了,Wicket是一个Java 语言的Web开发框架,与Struts,WebWork,Tapestry 相类似。其特点在于对Html和代码进行了有效的分离(有利于程序员和美工的合作),基于规则的...

oschina
2016/07/22
1K
10
Tapestry 教程(一)

介绍 欢迎来到 Tapestry 的世界! 这篇教程帮助人们来创建基于 Tapestry 的 web 应用程序。你是否有过使用 Tapestry 早期版本或者其它 web 框架的经历,这一点并不重要。事实上,从某些立场来...

LeoXu
2016/01/08
243
0

没有更多内容

加载失败,请刷新页面

加载更多

《精进》的读后感作文2600字

《精进》的读后感作文2600字: 首先,我想先分享我读这本书的过程,我是一名大一的学生,在我高考完的暑假,有一次一位知乎用户的朋友推荐了这本书。当时我看了这本书的封面,有一句话非常的...

原创小博客
22分钟前
2
0
亿万pv的混合云规划实施

基础服务: keepalive,lvs,nginx,dns,ntp,redis集群,yum仓库,web资源 网络高可用 防火墙冗余,交换机堆叠 专线互联 物理机虚拟化 VMware vcenter/ Proxmox...

以谁为师
43分钟前
4
0
聊聊dubbo的LRUCache

序 本文主要研究一下dubbo的LRUCache LRUCache dubbo-2.7.2/dubbo-common/src/main/java/org/apache/dubbo/common/utils/LRUCache.java public class LRUCache<K, V> extends LinkedHashMap<......

go4it
45分钟前
1
0
前端知识点总结——H5

前端知识点总结——H5 1.html5新特性 (1)新的语义标签 (2)增强型表单* (3)音频和视频 (4)Canvas绘图 (5)SVG绘图 (6)地理定位 (7)拖动API (8)Web Worker (9)Web Storage (10)Web Socket 2.增强...

智云编程
48分钟前
0
0
微服务之架构技术选型与设计

本文主要介绍了架构技术选型与设计-微服务选型,Spring cloud 实现采用的技术,希望对您的学习有所帮助。 架构技术选型与设计-DUBBODubbo,是阿里巴巴服务化治理的核心框架,并被广泛应用于阿...

别打我会飞
今天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部