liferay中的portlet之间的通信


https://web.liferay.com/en_US/community/wiki/-/wiki/Main/Inter-portlet+communication

1、相互间传递数据,通过事件机制实现。在通信的portlet配置文件中都做一个空间声明,并在portlet类中进行数据处理。

2、A Portlet 中的页面调用B portlet的方法,并将数据显示到B的页面。事例如下:

事例 

A  搜索portlet  B 分页显示Portlet ,实现将A搜索结果显示在B的页面。

条件:A、B同在一个页面。

过程:A页面的关键词通过 ajax传输到B的后台处理方法上并返回数据, 成功后的回调函数为B页面中JS方法。也就是A仅仅只将后台数据传给B,页面 显示的问题留给B操作,这样能避免页面中的含有命名空间的超链接出现A的命名空间名。

A的搜索页面

<liferay-portlet:resourceURL var="doExplore" portletName="XXX_WAR_XXXportlet_INSTANCE_9aBYMCJmkn8W" id="viewInit">      红色为B的Portlet名字,id为方法名
<liferay-portlet:param name="preConfigArraysString" value="dataConfig,showDataConfig,subConfig,showSubConfig,resourcesOrder,formConfig,procedureDeal"/>
</liferay-portlet:resourceURL>
<input type="text" id="<portlet:namespace/>keyWord" name="<portlet:namespace/>keyWord"  /> <button id="exploreIn" name="exploreIn">查询</button>
 <script type="text/javascript">


 (function(){
$(document).ready(function(){
 $("#exploreIn").click(function(){
       var keyWord= $("#<portlet:namespace/>keyWord").val();
       $.getJSON("<%=doExplore%>",{"_order_WAR_orderportlet_INSTANCE_9aBYMCJmkn8W_keyWord":keyWord},getPage );
   });
 });
})(jQuery);
   
</script>


B分页显示页面

<portlet:resourceURL id="viewInit" var="viewInit">
 <portlet:param name="preConfigArraysString" value="<%=preConfigArraysString %>"/></portlet:resourceURL>
 <portlet:resourceURL id="explore" var="explore"> </portlet:resourceURL>

<div class="items-con">
  <ul  id="<portlet:namespace/>shppingInfo" style="overflow:hidden;" ></ul>
</div>
<form id="frm">
            <input type="hidden" name="<portlet:namespace/>keyWord" id="keyWord" value=""/>
            <input type="hidden" name="<portlet:namespace/>pageSize" id="pageSize" value=""/>
            <input type="hidden" name="<portlet:namespace/>pageNumb" id="pageNumb" value=""/>
   <ul class="pagination" id="pageUl">  
 </form>
 
<script src="<%=path %>/js/bootstrap-paginator.js"></script> 
<script type="text/javascript">

(function($) {
   $(document).ready(function() {
      $.ajax({
               url: "<%=viewInit%>",
               dataType: " json",
               type: "Post",
               data: $("#frm").serialize(),
               success: getPage 
           });
   });
})(jQuery);


    function getPage(dataObj) {
        var otherInfo = dataObj.dataConfig.other;
        var dataInfo={};


        $.each(otherInfo,function(i,filed){  
                if("pageNumb"=== i){
                    dataInfo["pageNumb"] = otherInfo[i];
                    
                }else if("totalCount"=== i){
                    dataInfo["totalCount"] = otherInfo[i];
                    
                }else if("pageSize"=== i){
                    dataInfo["pageSize"] = otherInfo[i];


                }else if("keyWord"=== i){
                    dataInfo["keyWord"] = otherInfo[i];
                    $("#frm #keyWord").val(dataInfo.keyWord);
                }         
           });

        if(dataInfo.keyWord == "" || null == dataInfo.keyWord){
       $("#frm #keyWord").val("");
        }
         $("#pageSize").val(dataInfo.pageSize);
         $("#<portlet:namespace/>shppingInfo").empty().append(dealWithMess(dataObj));
    /* $pageInfo.text("第 "+ dataInfo.pageNumb +" 页/共 "+ dataInfo.totalCount +" 页 ");
        $pageNo.val(dataInfo.pageNumb);
        $pageSize.val(dataInfo.pageSize); */
        var options = {
                bootstrapMajorVersion: 3, //版本
                currentPage: dataInfo.pageNumb, //当前页数
                totalPages: dataInfo.totalCount, //总页数
                itemTexts: function (type, page, current) {
                    switch (type) {
                        case "first":
                            return "首页";
                        case "prev":
                            return "上一页";
                        case "next":
                            return "下一页";
                        case "last":
                            return "末页";
                        case "page":
                            return page;
                    }
                },//点击事件,用于通过Ajax来刷新整个显示数据 
               onPageClicked: function (event, originalEvent, type, page) {
                  
                   $("#pageNumb").val(page);
                   $.ajax({
                       url: "<%=viewInit%>",
                       type: "Post",
                       dataType: " json",
                       data: $("#frm").serialize(),
                       success: function (data1) {
                           if (data1 != null) {
                               $("#<portlet:namespace/>shppingInfo").empty().append(dealWithMess(data1));
                            } 
                        }
                   });
                  }
           };
           $('#pageUl').bootstrapPaginator(options);
    }
    
    
    function dealWithMess(data){
        
         var dataconfig=data.dataConfig.datum;
         var showDataConfig=data.showDataConfig;
         var htmlInner="";
    
           $.each(dataconfig,function(i,filed){
                   var name="";
                   var image="";
                   var id="";
                   var address="";
                   var elseview="";
                   var dept ="";
                   var specification =new Array();;
                   var supplier =new Array();
                   var pageNumb;
                   var totalCount;
                   var pageSize;
                   
                    for(var dcon in filed){
                       if(showDataConfig!=null){
                           var type=showDataConfig[dcon.toLowerCase()].type;
                           if(type=="name"){
                               name=filed[dcon];
                           }
                           if(type=="image"){
                               image=filed[dcon];
                           }
                           if(type=="id"){
                               id=filed[dcon];
                           }
                           if(type=="address"){
                               address=filed[dcon];
                           }
                           if(type=="dept"){
                               dept=filed[dcon];
                           }
                           if(type=="specification"){
                               specification.push(showDataConfig[dcon.toLowerCase()].value);
                               specification.push(filed[dcon]);
                           }
                           if(type=="supplier"){
                               supplier.push(showDataConfig[dcon.toLowerCase()].value);
                               supplier.push(filed[dcon]);
                           }
                       }
                    
                    }
                       
                    var portletURL="<liferay-portlet:renderURL  windowState='maximized'><portlet:param name='orderid' value='idforOrder'/><portlet:param name='mvcPath' value='viewInfo'/></liferay-portlet:renderURL>";
                    portletURL=portletURL.replace("idforOrder",id);
                   <%--  portletURL.setWindowState("<%=LiferayWindowState.MAXIMIZED.toString()%>"); --%>
                   htmlInner+= "<li class=\"list-detail\"><div   class=\"img list-detail-left\"><a href=\""+portletURL+"\"><img src=\"<%=path%>/images/11.jpg\"></a></div>";
                   htmlInner+= "<div class=\"info list-detail-right\"><span class=\"name\" >"+name+"</span>"
                   htmlInner+= "<span class=\"sort\"><span>"+supplier.shift()+" :"+supplier.shift()+"</span> "+specification.shift()+":"+specification.shift()+ id +"</span></div></li>";
               
            });
        return htmlInner;
    }


</script>



这是多Portlet页面间通信的最简单方式,链接为:1、https://web.liferay.com/en_US/community/wiki/-/wiki/Main/Client-side+Inter-Portlet+Communication

2、https://web.liferay.com/en_US/community/wiki/-/wiki/Main/Client-side+Inter-Portlet-Communication+%28IPC%29%20using+Java+Script     

引用如下:
Client-side Inter-Portlet-Communication (IPC) using Java Script
  Details   Print
Tags: development custom javascript inter-portlet communication client-side ipc 6.1.0
Preface - Even if there is already another article about IPC using Java Script, I add another one, because the mentioned article is very long, uses not useful examples, and contains some errors that cost me several hours ^^.


There are two ways IPC can be realized: server side and client side. As stated in the title, this article is about the client side implementation using Java Script. To do this, Liferay's native Java Script API provides a very useful event bus system: one can send an event (a tuple consisting of an event name and parameters) into the bus and on another place one can react to this event. Since this bus system is portlet cross border, one can react on an event within the same portlet or in any other portlet. There are two static methods one can use: fire to fire an event into the bus combined with optional parameters, and on to react on an event in the bus using the optional parameters. The parameters are interchanged following the key/value format.


Following the example code




// IN PORTLET 1
// Send the event 'siteWideUniqueEventName' to the bus
Liferay.fire(
   "siteWideUniqueEventName",
   {
      paramKey1 : "paramValue1",
      paramKey2 : 42,
   }
);


// IN PORTLET 2
// In portlet 2, react on the event using the
// first parameter
Liferay.on(
   "siteWideUniqueEventName",
   function(data) {
alert("I'm portlet 2 and the value is" + data.paramKey1);
   }
);


// IN PORTLET 3
// In portlet 3, react on the event using the
// second parameter
Liferay.on(
   "siteWideUniqueEventName",
   function(data) {
alert("I'm portlet 3 and do some calc: " + (2 * data.paramKey2));
   }
);


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值