ExtJs direct 推送 DEMO

最新推荐文章于 2019-04-19 10:34:53 发布

txctxc

最新推荐文章于 2019-04-19 10:34:53 发布

阅读量605

点赞数 1

分类专栏： ExtJS 文章标签： ExtJS 推送 direct

ExtJS 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<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 ;
  }
}

txctxc

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
ExtJs direct 推送 DEMO

Ext.onReady(function (){ var html = ''; var out = new Ext.form.DisplayField({ cls: 'x-form-text', id: 'out', renderTo: 'outdiv', autoScroll: true }); //输出打印信息的DisplayField Ext.D
复制链接

扫一扫