其他子要代码见附件
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link rel="stylesheet" type="text/css" href="../extjs/resources/css/ext-all.css">
<link rel="stylesheet" type="text/css" href="../extjs/examples/shared/examples.css" />
<script type="text/javascript" src="../extjs/adapter/ext/ext-base-debug.js"></script>
<script type="text/javascript" src="../extjs/ext-all-debug.js"></script>
<!--以下为DirectJNgine的基础JS文件,放在djn目录下,直接引用就可以。-->
<script type="text/javascript" src="../djn/djn-remote-call-support.js"></script>
<script type="text/javascript" src="../ejn/ejn-assert.js"></script>
<!--以上为DirectJNgine的基础JS文件.-->
<script type="text/javascript" src="MyActionApi.js"></script>
</head>
<script type="text/javascript" >
Ext.onReady(function (){
var html = '';
var out = new Ext.form.DisplayField({
cls: 'x-form-text',
id: 'out',
renderTo: 'outdiv',
autoScroll: true
}); //输出打印信息的DisplayField
Ext.Direct.addProvider(Ext.app.REMOTING_API,
{
id:'poll',
type:'polling',
url:Ext.app.POLLING_URLS.message, // 'string/function'
baseParams:{'polling_date':new Date()},
interval:2000
});
/** polling 追加 监听 **/
Ext.Direct.on('message', function(e)
{
out.append(String.format('<p><i>{0}</i></p>', e.data));
out.el.scroll('b', 100000, true);
});
/**
Ext.Direct.getProvider('poll').on('message',function(e)
{
// dosomething ...
})
alert(Ext.Direct.getProvider('poll').hasListener('message'));
**/
//调用后台方法
var multiply = new Ext.Button({
text: '调用后台方法',
handler: function(){
try
{
//根据类名MyAction调用它的方法doEcho,此函数没有传入参数。回调函数的参数result表示返回的结果。参数e表示当前调用状态。
MyAction.doEcho(function(result, e){
var t = e.getTransaction();
if(e.status){
out.append(String.format('<p><b>Successful call to {0}.{1} with response:</b><xmp>{2}</xmp></p>',
t.action, t.method, Ext.encode(result)));
}else{
out.append(String.format('<p><b>Call to {0}.{1} failed with message:</b><xmp>{2}</xmp></p>',
t.action, t.method, e.message));
}
out.el.scroll('b', 100000, true);
});
}
catch(err)
{
alert(err.description);
}
}
});
//panel
var p = new Ext.Panel({
title: '远程调用方法输出日志',
//frame:true,
width: 600,
height: 300,
layout:'fit',
items: [out],
bbar: [multiply]
}).render(Ext.getBody());
});
</script>
<body>
<h1>Ext Direct 使用directjngine项目,调用后台Java方法</h1>
<div id="outdiv"></div>
<div id="txtFieldDiv"></div><br/>
</body>
</html>
package com.softwarementors.extjs.djn.MyAction;
import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.Map;
import com.softwarementors.extjs.djn.config.annotations.DirectAction;
import com.softwarementors.extjs.djn.config.annotations.DirectMethod;
import com.softwarementors.extjs.djn.config.annotations.DirectPollMethod;
//@DirectAction(action="MyAction")
public class MyAction
{
/**
* @return str
*/
@DirectMethod
public String doEcho()
{
System.out.println("com.softwarementors.extjs.djn.MyAction - 进入后台服务器端 #remotingProvider# ");
return "@DirectMethod :MyAction.doEcho";
}
/**
* @param params
* @return str
*/
@DirectPollMethod(event="message")
public String doShow(Map<String,String> params) {
System.out.println("com.softwarementors.extjs.djn.MyAction - 进入后台服务器端 #pollingProvider# ");
// assert params != null;
String param = params.get("polling_date");
System.out.println(" params : " + param);
Calendar calendar = Calendar.getInstance();
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd hh:mm:ss");
String time = sdf.format(calendar.getTime());
return time ;
}
}
分享到:
相关推荐
ExtJS Direct Demo是一个基于ExtJS框架的示例项目,展示了如何使用Direct技术进行客户端与服务器端的通信。ExtJS Direct是一种高效、低延迟的API调用机制,它允许JavaScript直接与服务器上的方法交互,简化了AJAX...
ExtJS后台框架_Demo,只写了一部份,可供学习人员查看并完善!
Extjs4.2练习小Demo,新手第一次上传啦,多要点分好下载更多的资源的说
ExtJs Demo100个演示Demo
ExtJS4 Direct Demo using JAVA 是一个关于如何在Java环境下实现ExtJS4的Direct技术的示例项目。Direct技术是ExtJS提供的一种与服务器端进行高效通信的方法,它允许JavaScript直接调用服务器端的方法,减少了HTTP...
ExtJS 是一个强大的JavaScript库,专门用于构建富客户端的Web应用程序。在本示例中,我们专注于ExtJS 4.0版本,这是一个功能丰富的框架,提供了丰富的组件、布局管理和数据绑定等功能。 首先,要开始学习ExtJS 4,...
extjs的经典标签,表单等案例,学习extjs前端框架的基础
在"extJS3.1源码及demo"这个资源中,你将找到ExtJS 3.1.0的完整源代码和相关的示例。源码的分析对于深入理解框架的工作原理至关重要,特别是对于那些想要进行定制化开发或者优化性能的开发者来说。源码包含了各种...
extjs 4.0官方资源包,里边包含大量的例子,建议放在web服务下后访问。
EXTJS3.0登录DEMO是一个基于EXTJS框架的示例项目,展示了如何将EXTJS与STRUTS2、SPRING和IBATIS等流行Java技术整合,构建一个完整的Web应用程序。EXTJS是一个用于创建富客户端界面的JavaScript库,而STRUTS2、SPRING...
在“ExtJs4.0 表单提交Demo”中,我们将深入探讨如何在ExtJs 4.0环境下,通过Ext Ajax模块实现表单的数据提交,同时实现显示层和控制层的分离,提升代码的可维护性和可扩展性。 1. **ExtJs 4.0 表单基础** ExtJs ...
http://【localhost:5012/web】/Extjs5Demo/build/examples/index.html 【】内,输入Extjs5Demo在服务器上的地址,即可看到官方文档
"ExtJs_TreeDemo"是一个示例,展示了如何在ExtJs中实现树形菜单的功能。 在ExtJs中,树形菜单(Tree)是通过`Ext.tree.Panel`类来创建的。这个类提供了丰富的配置选项和事件处理机制,使得开发者可以定制各种交互...
本篇文章将探讨如何在Yii Framework中整合ExtJS Direct以实现RPC(Remote Procedure Call)通信。 首先,让我们了解RPC的概念。RPC允许客户端应用程序调用服务器上的方法就像调用本地方法一样,简化了客户端与...
extjs+java 的demo。 part1 后续更新完,总共2部分.
extJs 首页demoextJs 首页demo
在“ExtJs 1714 个图标 Demo”中,我们主要关注的是ExtJS图标系统,这是一套完整的图形资源,用于美化和增强UI交互。这个Demo包括了多种CSS样式和PNG图标文件,以及一个演示如何在实际应用中使用这些图标的HTML示例...
"extjs+demo+api"这个标题暗示了我们将探讨ExtJS的示例、演示以及其API的使用。 在ExtJS的API中,包含了众多类、方法和配置选项,这些构成了其核心功能。例如,`Ext.Component`是所有UI组件的基础,包括按钮、面板...
extjs初体验 适合extjs初学者 extjs版本为4.2.1 结构简单 适合入门
extjs4的面板,表单的例子