1、首先liferay要发送ajax请求，那么就需要在jsp中定义resourceURL

<portlet:resourceURL var="workDeal" id="workDeal" />

2、然后我们如何使用alloy-ui读取数据？

这里我们可以借助alloy-ui提供的一个IO功能，发送ajax请求并从结果中读取数据

demo：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

    <link rel="stylesheet" href="../../build/aui-css/css/bootstrap.css">

    <script src="../../build/aui/aui.js"></script>

</head>

<body>

    <h1>AlloyUI - I/O demo</h1>

    <script>

    YUI({ filter:'raw' }).use('aui-io', function(Y) {

        Y.io.request('data/content.html', {

            on: {

                success: function() {

                    var data = this.get('responseData');

                    alert(data);

                }

            }

        });

    });

    </script>

</body>

</html>

这个案例中，是从一个文件中读取内容，然后alert输出

3、那么如果通过ajax请求获取数据，而不是读取文件呢？

function callWorkDeal(workDealUrl){

    var data = '';

    YUI({filter:'raw'}).use('aui-tabview', function(Y){

        Y.io.request(workDealUrl, {

            method:'get',

            on:{

                success:function(){

                    //处理数据

                    var recevieData = this.get('responseData');

                }

            }

        });

    });

}

可以通过这个函数来触发这个ajax操作，从而从后天获取对应的数据

4、如何展示tab页？

new Y.TabView({

            children: [

                {

                    label: 'foo',

                    content: '<p>foo content</p>'

                },

                {

                    label: 'bar',

                    content: '<p>bar content</p>'

                },

                {

                    label: 'fooz',

                    content: '<p>fooz content</p>'

                }

           ],

           srcNode: '#pills',

           type: 'pills'

        }).render();

效果类似：

5、通过ajax请求获取数据，展示在tab页中，这里使用的是liferay

<portlet:resourceURL var="workDeal" id="workDeal" />

<br/>

<div id="workDeal">

    <ul class="nav nav-tabs">

        <li class="active"><a href="#myWorkDeal">我的待办</a></li>

        <li><a href="#region">市待办</a></li>

        <li><a href="#province">省待办</a></li>

    </ul>

    <div class="tab-content">

        <div id=myWorkDeal>

        </div>

        <div id="region" class="tab-pane">

        </div>

        <div id="province" class="tab-pane">

        </div>

    </div>

</div>

<br/>

js部分

<script>

	YUI({filter:'raw'}).use('aui-tabview', function(Y){

		new Y.TabView({

		    srcNode: '#workDeal'

		}).render();

	});

	function <portlet:namespace/>showDaiban() {

		$.ajax({

			type:'POST',

			url:'<%=workDeal%>',

			data:'',

			dataType:'json',

			timeout:5000,

			cache:false,

			async:false,

			success:function(dealdata){

				//$('#ssoUrl').attr('href', dataurl);

				//data = dealdata;

				$.each(dealdata, function(n, value){

					//加上链接

	                var dealurl = eval("(" + value.content + ")");

					var content="";

	                $.each(dealurl, function(n, value){

	                	content += "<a href=\"" + value.url + "\">" + value.text + "</a><br/>";

					});

	                //拼接上

	                $('#' + value.label).html(content);

				});

				//去除最后一个，号

				if(lenjson > 0)

					tbody=tbody.substring(0,tbody.length-1);

				tbody += "]";

			},

			error:function(request){

				alert("connection error " + request);

			}

		});

	}

</script>

后台获取数据传到前台

package cn.ffcs.demo.portlet;

import java.io.IOException;

import java.io.PrintWriter;

import java.io.Serializable;

import java.util.ArrayList;

import java.util.Date;

import java.util.HashMap;

import java.util.List;

import java.util.Map;

import javax.portlet.ActionRequest;

import javax.portlet.ActionResponse;

import javax.portlet.PortletException;

import javax.portlet.RenderRequest;

import javax.portlet.RenderResponse;

import javax.portlet.ResourceRequest;

import javax.portlet.ResourceResponse;

import javax.servlet.http.Cookie;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import cn.ffcs.demo.model.Books;

import cn.ffcs.demo.model.impl.BooksImpl;

import cn.ffcs.demo.service.BooksLocalService;

import cn.ffcs.demo.service.BooksLocalServiceUtil;

import cn.ffcs.hbup.action.workdeal.service.WorkDealService;

import cn.ffcs.hbup.action.workdeal.vo.WorkDealVo;

import com.liferay.counter.service.CounterLocalServiceUtil;

import com.liferay.portal.kernel.dao.orm.DynamicQuery;

import com.liferay.portal.kernel.dao.orm.DynamicQueryFactoryUtil;

import com.liferay.portal.kernel.dao.orm.ProjectionFactoryUtil;

import com.liferay.portal.kernel.dao.orm.ProjectionList;

import com.liferay.portal.kernel.dao.orm.PropertyFactoryUtil;

import com.liferay.portal.kernel.exception.PortalException;

import com.liferay.portal.kernel.exception.SystemException;

import com.liferay.portal.kernel.json.JSONArray;

import com.liferay.portal.kernel.json.JSONException;

import com.liferay.portal.kernel.json.JSONFactoryUtil;

import com.liferay.portal.kernel.json.JSONObject;

import com.liferay.portal.kernel.json.JSONTransformer;

import com.liferay.portal.kernel.util.ParamUtil;

import com.liferay.portal.kernel.util.PropertiesParamUtil;

import com.liferay.portal.kernel.util.Validator;

import com.liferay.portal.model.BaseModel;

import com.liferay.portal.model.CacheModel;

import com.liferay.portal.model.User;

import com.liferay.portal.service.ServiceContext;

import com.liferay.portal.util.PortalUtil;

import com.liferay.portlet.expando.model.ExpandoBridge;

import com.liferay.util.bridges.mvc.MVCPortlet;

/**

 * Portlet implementation class BookPortlet

 */

public class BookPortlet extends MVCPortlet {

	@Override

	public void serveResource(ResourceRequest resourceRequest,

			ResourceResponse resourceResponse) throws IOException,

			PortletException {

		String resourceId = resourceRequest.getResourceID();

		//这连个是resourceRequest和resourceResponse 是原生的一个包装，加了一些liferay的信息

		HttpServletRequest request = PortalUtil

				.getHttpServletRequest(resourceRequest);

		HttpServletResponse response = PortalUtil

				.getHttpServletResponse(resourceResponse);

		PrintWriter out = null;

		try {

			out = resourceResponse.getWriter();

		} catch (IOException e) {

			e.printStackTrace();

		}

		if(resourceId.equals("ssoUrl")) {

			List urls = new ArrayList<String>();

			String url1 = "http://cfmf-p6.mss.ctc.com/portal/sso/ssoAuthenticate!mssSsoLogin.action";

			String url2 = "http://10.128.114.6:80/adaptercas/login.do?ssoUrl=http%3A%2F%2Feiac.hubeitel.com%2Fuap%2Fsso2.do%3FappCode%3DUAP_WD%26provinceCode%3D06";

			String url3 = "http://uip.hq.ctc.com/uip/open/loginAloneNewAuth.htm?ssoUrl=http%3A%2F%2Feiac.hubeitel.com%2Fuap%2Fsso2.do%3FappCode%3DUAP_UIP%26provinceCode%3D06&redirectUrl=http%3A%2F%2Fuip.hq.ctc.com%2Fuip%2F%40jt%2Findex.htm";

			String url4 = "http://websites.hq.ctc.com/et/open/loginAloneNewAuth.htm?ssoUrl=http%3A%2F%2Feiac.hubeitel.com%2Fuap%2Fsso2.do%3FappCode%3DUAP_BMMH%26provinceCode%3D06&redirectUrl=http%3A%2F%2Fwebsites.hq.ctc.com%2Fet%2F%40qzlx%2Findex.htm";

			String url5 = "http://websites.hq.ctc.com/et/open/loginAloneNewAuth.htm?ssoUrl=http%3A%2F%2Feiac.hubeitel.com%2Fuap%2Fsso2.do%3FappCode%3DUAP_BMMH%26provinceCode%3D06&redirectUrl=http%3A%2F%2Fwebsites.hq.ctc.com%2Fet%2F%40shgg%2Findex.htm";

			String url6 = "http://websites.hq.ctc.com/et/open/loginAloneNewAuth.htm?ssoUrl=http%3A%2F%2Feiac.hubeitel.com%2Fuap%2Fsso2.do%3FappCode%3DUAP_BMMH%26provinceCode%3D06&redirectUrl=http%3A%2F%2Fwebsites.hq.ctc.com%2Fet%2F%40hx%2Findex.htm";

			String url7 = "http://websites.hq.ctc.com/et/open/loginAloneNewAuth.htm?ssoUrl=http%3A%2F%2Feiac.hubeitel.com%2Fuap%2Fsso2.do%3FappCode%3DUAP_BMMH%26provinceCode%3D06&redirectUrl=http%3A%2F%2Fwebsites.hq.ctc.com%2Fet%2F%40lte%2Findex.htm";

			String url8 = "http://eiac.hubeitel.com/uap/sso2.do?appCode=UAP_DXXW&provinceCode=06";

			String url9 = "http://10.140.19.144:87/linedfree/ChainNewAuth.jsp?ssoUrl=http%3A%2F%2Feiac.hubeitel.com%2Fuap%2Fsso2.do%3FappCode%3DUAP_GM%26provinceCode%3D06";

			String url10 = "http://10.140.19.164:8080/address/open/loginAloneNew.htm?ssoUrl=http%3A%2F%2Feiac.hubeitel.com%2Fuap%2Fsso2.do%3FappCode%3DUAP_ADDRESS%26provinceCode%3D06";

			String url11 = "http://www.chntel.com";

			String url12 = "http://www.ctebuy.com";

			String url13 = "http://132.129.4.111/staff/serverpages/front/login.jsp";

			String url14 = "http://hbmis0.hubeitel.com/dx_common.nsf/intf_redirectto_GroupEmail?openform";

			String url15 = "http://hr-hq.mss.ctc.com/service/ssoRegServlet";

			String url16 = "http://hrzp-hq.mss.ctc.com/portal/auth";

			String url17 = "http://sjfz-hq.mss.ctc.com/audit/sso/login.do";

			String url18 = "http://mssportal.mss.ctc.com/ZgdxLogin?ssoUrl=http%3A%2F%2Ftyrz-hq.hubeitel.com%2Fuap%2Fsso2.do%3FappCode%3DmssPortal%26provinceCode%3D06&progID=http%3a%2f%2flaw-hq.mss.ctc.com%2flwmis%2fsecurity%2flogin%3fauthType%3dnfsapsso";

			urls.add(url1);urls.add(url2);urls.add(url3);urls.add(url4);urls.add(url5);

			urls.add(url6);urls.add(url7);urls.add(url8);urls.add(url9);urls.add(url10);

			urls.add(url11);urls.add(url12);urls.add(url13);urls.add(url14);urls.add(url15);

			urls.add(url16);urls.add(url17);urls.add(url18);

			//组装json

			StringBuffer jsonStr = new StringBuffer("[");

			jsonStr.append("\"").append(url1).append("\",");

			jsonStr.append("\"").append(url2).append("\",");

			jsonStr.append("\"").append(url3).append("\",");

			jsonStr.append("\"").append(url4).append("\",");

			jsonStr.append("\"").append(url5).append("\",");

			jsonStr.append("\"").append(url6).append("\",");

			jsonStr.append("\"").append(url7).append("\",");

			jsonStr.append("\"").append(url8).append("\",");

			jsonStr.append("\"").append(url9).append("\",");

			jsonStr.append("\"").append(url10).append("\",");

			jsonStr.append("\"").append(url11).append("\",");

			jsonStr.append("\"").append(url12).append("\",");

			jsonStr.append("\"").append(url13).append("\",");

			jsonStr.append("\"").append(url14).append("\",");

			jsonStr.append("\"").append(url15).append("\",");

			jsonStr.append("\"").append(url16).append("\",");

			jsonStr.deleteCharAt(jsonStr.length() - 1);

			jsonStr.append("]");

			System.out.println(jsonStr.toString());

			out.print(jsonStr.toString());

		} else if(resourceId.equals("workDeal")) {

			try {

				//如果是代办

				WorkDealService wds = new WorkDealService();

				String accessTokenDecrypt = null;

				String oaAccount = "";

				//获取oaAccount

				Map<String, Cookie> cookieMap = readCookieMap(request);

				Cookie token = cookieMap.get("accessTokenDecrypt");

				Cookie ltpaToken = cookieMap.get("LtpaToken");

				if (token != null)

					accessTokenDecrypt = token.getValue();

				if (accessTokenDecrypt != null) {

					// 创建对应的json串，获取ssopare

					JSONObject accessTokenJson = JSONFactoryUtil

							.createJSONObject(accessTokenDecrypt);

					// 2、从token中获取对应的oa账号

					String ssoSpare = accessTokenJson.getString("ssoSpare");

					if(ssoSpare != null) {

						oaAccount = ssoSpare;

					}

				}

				List<WorkDealVo> resultWorks = wds.getAllWorks(oaAccount, ltpaToken);

				//输出json串

				StringBuffer outJson = new StringBuffer("[");

				for(WorkDealVo work : resultWorks) {

					outJson.append(work.toJsonString()).append(",");

				}

				//去除最后一个逗号

				//{

				//label: 'fooz',

				// content: '<p>fooz content</p>'

				// }

				if(resultWorks.size() > 0)

					outJson.deleteCharAt(outJson.length() - 1);

				outJson.append("]");

				JSONArray children = JSONFactoryUtil.createJSONArray();

				JSONObject myWorkDeal = JSONFactoryUtil.createJSONObject();

				JSONObject region = JSONFactoryUtil.createJSONObject();

				JSONObject province = JSONFactoryUtil.createJSONObject();

				myWorkDeal.put("label", "myWorkDeal");

				myWorkDeal.put("content", outJson.toString());

				region.put("label", "region");

				region.put("content", outJson.toString());

				province.put("label", "province");

				province.put("content", outJson.toString());

				children.put(myWorkDeal);

				children.put(region);

				children.put(province);

				out.print(children.toString());

			} catch (JSONException e) {

				// TODO Auto-generated catch block

				e.printStackTrace();

			}

		}

		out.flush();

		out.close();

		super.serveResource(resourceRequest, resourceResponse);

	}

	public Map<String, Cookie> readCookieMap(HttpServletRequest request) {

		Map<String, Cookie> cookieMap = new HashMap<String, Cookie>();

		Cookie[] cookies = request.getCookies();

		if (null != cookies) {

			for (Cookie cookie : cookies) {

				System.out.println("获取cookie:" + cookie.getName() + " value:"

						+ cookie.getValue());

				cookieMap.put(cookie.getName(), cookie);

			}

		}

		return cookieMap;

	}

}

效果展示：

 

【liferay】1、使用alloy-UI发送ajax请求的更多相关文章

  1. 在发送ajax请求时加时间戳或者随机数去除js缓存

    在发送ajax请求的时候,为了保证每次的都与服务器交互,就要传递一个参数每次都不一样,这里就用了时间戳 大家在系统开发中都可能会在js中用到ajax或者dwr,因为IE的缓存,使得我们在填入相同的值的 ...

  2. 原生js发送ajax请求

    堕落了一阵子了,今天打开博客,发现连登录的用户名和密码都不记得了.2016年已过半,不能再这么晃荡下去了. 参加了网易微专业-前端攻城狮 培训,目前进行到大作业开发阶段,感觉举步维艰.但是无论如何,不 ...

  3. jQuery发送ajax请求

    利用jquery发送ajax请求的几个模板代码. $.ajax({ async : false, type: 'POST', dataType : "json", url: &qu ...

  4. JQuery发送ajax请求不能用数组作为参数

    JQuery发送ajax请求不能用数组作为参数,否则会接收不到参数, 一.js代码如下: $('#delete-button').click(function(){        var select ...

  5. js中使用队列发送ajax请求

    最近,项目中需要按照先后顺序发送ajax请求,并且在一次请求结束后才能发起下一次,不然就会导致逻辑错误. 解决办法是定义一个数组,保存ajax请求数据. 以下使用extjs4定义一个类 Ext.def ...

  6. IE6下a标签上发送ajax请求总是error

    IE6下真是处处是坑啊!!!走过了一个又一个坑,记录一下吧. 之前不知道a标签上注册click事件之后,发送ajax请求总是error.后来经过几番网上搜索,终于找到高人遇到此坑的解决办法.原来是a标 ...

  7. Jquery发送ajax请求以及datatype参数为text/JSON方式

    Jquery发送ajax请求以及datatype参数为text/JSON方式 1.方式一:datatype:'text' 2.方式二:datatype:'JSON' 3.使用gson-1.5.jar包 ...

  8. Axios发送AJAX请求

    目录 Axios 特征 axios提供主要三种发起请求的方式 方式一:直接axios实例直接call方式 方式二:通过axios实例提供的不同http请求方式的方法 方式三:其实是从第二种方式中单独提 ...

  9. 接入天猫精灵auth2授权页面https发送ajax请求

    已存在一个应用A,采用的是http交互, 在接入天猫精灵时,要求请求类型是https,所以在应用服务前加了个nginx转发https请求.在绑定授权页面,会发送ajax请求验证用户名和密码,采用htt ...

随机推荐

  1. 默认权限umask、文件系统权限、特殊权限

    第1章 权限相关错误 1.1 普通用户 ls /root/ /root  属于root 普通用户没有任何权限,所以无法查看 [oldboy@znix ~]$ ls /root/ ls: cannot ...

  2. IdentityServer4 指定角色授权（Authorize(Roles="admin"))

    1. 业务场景 IdentityServer4 授权配置Client中的AllowedScopes,设置的是具体的 API 站点名字,也就是使用方设置的ApiName,示例代码: //授权中心配置 n ...

  3. 小明滚出---响应对象HttpServletResponse和请求对象HttpServletRequest实例

    <Servlet类的Java> @WebServlet("/studentServlet") public class StudentServlet extends H ...

  4. visual studio 2013使用github获取代码

    如图点击"视图""团队资源管理器".   点击主页上方的那个插头形状按钮"连接到团队项目".点击"克隆"   然后在克隆 ...

  5. SQL表连接查询(inner join(join)、full join、left join、right join、cross join)

    下面列出了您可以使用的 JOIN 类型,以及它们之间的差异. JOIN: 如果表中有至少一个匹配,则返回行(join=inner join) LEFT JOIN: 即使右表中没有匹配,也从左表返回所有 ...

  6. SEO内链操作的技巧大家又知道多少

    关于一个优质的网站而言,一套优质的内部优化链接体系是必不可少的,简略来说杰出的内链体系能让网站页面之前彼此传递权重,协助搜索引擎快速辨认网站内容的中心,可是SEO内链操作的技巧我们又知道多少?下面齐鲁 ...

  7. NULL字段对于UNIQUE INDEX失效

  8. js的数组方法整理

    slice 从已有的数组中返回选定的元素.该方法不会修改数组,而是返回一个子数组. 语法:arr.slice(start,end) start: 必须,规定从何处开始选取.如果是负数,就是从尾部开始算 ...

  9. .NET之RabbitMQ学习笔记(一)-应用场景

    使用场景 1.异步处理 用户注册后,需要发注册邮件和注册短信,传统的做法有两种1.串行的方式;2.并行的方式 (1)串行处理方式:注册信息写数据库-发送注册邮件-发送注册短信,等上述三个操作都执行完成 ...

  10. jfinal 源码学习

    源由 最近闲来无事,顺带看了下jfinal的源码,以下均为自己的个人理解,如有错误请指定: jfinal 使用 在web.xml中配置JfinalFilter 并定义JfinalConfig的类 自定 ...