zoukankan      html  css  js  c++  java
  • 【liferay】1、使用alloy-UI发送ajax请求

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

    效果展示:

     
  • 相关阅读:
    Git常用命令
    Shell脚本学习
    Shell脚本学习
    Shell脚本学习
    Git ignore文件的用法
    RSA非对称加密算法
    C++ 标准库中的堆(heap)
    EM(Entity FrameWork)- code first , using in Visual stdio 2017
    C# 图片文字识别
    C# 调 C++ DLL 托管代码中释放非托管函数分配的内存
  • 原文地址:https://www.cnblogs.com/cutter-point/p/8074679.html
Copyright © 2011-2022 走看看