Liferay异步提交

liferay的异步提交其实是非常简单的，他用的是json & jquery

    1.jsp相关代码如下

<script type="text/javascript">
function <portlet:namespace/>change(){
	/*我用的是plugin开发方式，所以URL是这种方式，如果是ext方式要用
	<portlet:actionURL windowState="<%= LiferayWindowState.EXCLUSIVE.toString() %>">
	<portlet:param name="struts_action" value="/blogs/edit_entry" /></portlet:actionURL>,
        注意LiferayWindowState.EXCLUSIVE.toString()这个不可以用错*/
	var url = '<%=request.getContextPath()%>/portlet_action/dashboard/salestrend';
	jQuery.ajax({
		type: 'POST',
		url:url,
		data:{
			//参数传递
			userId:'<%=PortalUtil.getUserId(request)%>',
			regionId:regionId,
			provinceId:provinceId,
			cityId:cityId,
			year:year,
			month:month,
			grouping:grouping,
			targetValue:targetValue
		},
		dataType:'json',
		beforeSend: function() {
			//发送前出现一个加载中的图片
			jQuery('#<portlet:namespace/>dashboard-content').html('<div style="text-align:center;"><img width="32" height="32" src="<%=themeDisplay.getTheme().getContextPath()+themeDisplay.getTheme().getImagesPath()%>/progress_bar/loading_animation.gif"/></div>');
		},
		success: function(message){
			//成功，message是json对象
			jQuery('#<portlet:namespace/>dashboard-content').html(message.xml);
		},
		error: function() {
			//报错处理
			jQuery('#<portlet:namespace/>dashboard-content').html('<span class="portlet-msg-error"><liferay-ui:message key="an-unexpected-system-error-occurred"/></span>');
		}
	});
}
<script type="text/javascript">

 2.JSONAction相关代码如下：

//class一定要继承JSONAction
	public String getJSON(ActionMapping mapping, ActionForm form,
			HttpServletRequest request, HttpServletResponse response)
			throws Exception {
		long userId = ParamUtil.getLong(request, "userId");
		Date date = ParamUtil.getDate(request, "date", IdmDateUtil.DATE_FORMAT);
		
		List<SalesTargetInfo> productVariants = SalesTargetServiceUtil.getProductVariantList(userId, date);
		JSONArray variantJsonArray = JSONFactoryUtil.createJSONArray();
		for(SalesTargetInfo salesTarget : productVariants){
			JSONObject jsonObj = JSONFactoryUtil.createJSONObject();
			jsonObj.put("id", salesTarget.getTargetId());
			jsonObj.put("val", salesTarget.getValDoubleDesc());
			jsonObj.put("type", salesTarget.getType());
			variantJsonArray.put(jsonObj);
		}
		
		List<SalesTargetInfo> productGroup = SalesTargetServiceUtil.getProductGroupList(userId, date);
		JSONArray groupJsonArray = JSONFactoryUtil.createJSONArray();
		for(SalesTargetInfo salesTarget : productGroup){
			JSONObject jsonObj = JSONFactoryUtil.createJSONObject();
			jsonObj.put("id", salesTarget.getTargetId());
			jsonObj.put("val", salesTarget.getValDoubleDesc());
			jsonObj.put("type", salesTarget.getType());
			groupJsonArray.put(jsonObj);
		}
		
		JSONObject jsonObj = JSONFactoryUtil.createJSONObject();
		jsonObj.put("variant", variantJsonArray);
		jsonObj.put("group", groupJsonArray);
		
		// TODO Auto-generated method stub
		return jsonObj.toString();
	}

 3.如果你对JSON不熟，希望下代码能帮助你

//参数message就是发送成功后success: function(message)中的message（json对象）
	function <portlet:namespace/>setVriantAndGroup(message){

		var variants = message.variant;
		
		for(var i=0;i<variants.length;i++){
			variant = variants[i];
			if(variant.id == id && variant.type == <%=IdmWebKeys.SALES_TARGET_TYPE_THIRD%>){						
				jQuery(this).children('td:nth-child(3)').children(':first-child').val(variant.val);
				
			}else if(variant.id == id && variant.type == <%=IdmWebKeys.SALES_TARGET_TYPE_FORTH%>){
				jQuery(this).children('td:nth-child(2)').children(':first-child').val(variant.val);
				
			}
		}

		var groups = message.group;
		
		for(var i=0;i<groups.length;i++){
			group = groups[i];
			if(group.id == id && group.type == <%=IdmWebKeys.SALES_TARGET_TYPE_THIRD%>){
				jQuery(this).children('td:nth-child(3)').children(':first-child').val(group.val);
				
			}else if(group.id == id && group.type == <%=IdmWebKeys.SALES_TARGET_TYPE_FORTH%>){
				jQuery(this).children('td:nth-child(2)').children(':first-child').val(group.val);
				
			}
		}
	}

 4.如果返回的数据很大，并且需要改变的UI也有很多地方，例如：你提交一个form成功后，需要整个换掉这个form,那么用js是一件痛苦的事，这里还有一个更简单的做法在后台JSONAction中做文章，下面是一个列子

public String getJSON(ActionMapping mapping, ActionForm form,
			HttpServletRequest request, HttpServletResponse response)
			throws Exception {
		// TODO Auto-generated method stub
		
		String path = StrutsUtil.TEXT_HTML_DIR;
		path += "/user/edit_user.jsp";
		
		long userId = ParamUtil.getLong(request, "userId");
		String cmd = ParamUtil.getString(request, Constants.CMD);
		long selUserId = ParamUtil.getLong(request, "selUserId");
		String namespace = ParamUtil.getString(request, "namespace");
		
		RequestDispatcher requestDispatcher =
			request.getRequestDispatcher(path);

		StringServletResponse stringResponse = new StringServletResponse(
			response);
		stringResponse.setContentType("text/xml; charset=UTF-8");
		request.setAttribute("userId", new Long(userId));
		request.setAttribute(Constants.CMD, cmd);
		request.setAttribute("selUserId", new Long(selUserId));
		request.setAttribute("namespace", namespace);

		requestDispatcher.include(request, stringResponse);
		
		JSONObject jsonObj = JSONFactoryUtil.createJSONObject();
		
		jsonObj.put("userContent", stringResponse.getString());
		
		return jsonObj.toString();
	}

    看出来了吗，所有的东西都在/user/edit_user.jsp里面，这样就不用去考虑让人头痛的JS了，全都交给JSP去做，然后直接反回生成的HTML代码，你只需要jQuery('#**').html(message.userContent),一切都结束了，整个世界都清静了。

以下备注一定要看：

    在做异步提交的时候一定要做好安全认证，特别是plugin方式，因为plugin里面的request不是portal里面的request，他里面什么都没有（PortletURL方式提交除外），所以我一般会把userId给带进去，在做操作之前先check一下这个user是否有这个操作的权限。
    如果你想让request和liferay里面的一样，你需要去继承PortletActionServlet，并且在里面写上一些Events,listener,liferay很次request里面都会有一堆的信息，都是在这些Events,listener里面处理的，但是具体是那些我还没搞明白。

评论

2 楼 yaokaiwen99 2011-11-18  

大哥求一个简单的flexigrid在liferay中应用的例子。我也是那么写的URL，不调用ACTION，也不报错。

1 楼 gaigai511225 2011-11-17  

你好 插件环境那个url 具体怎么写 我照您的方式写了出错 没有调用action