【liferay】1、使用alloy-UI发送ajax请求

2022-10-09 11:24:34

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输出

【liferay】1、使用alloy-UI发送ajax请求

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();

效果类似：

【liferay】1、使用alloy-UI发送ajax请求

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请求

 
上一篇：VBA取得EXCEL表格中的行数和列数


下一篇：apply、bind、call方法的作用与区别