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里面处理的,但是具体是那些我还没搞明白。