RemoteCommand provides a simple way to execute backing bean methods with javascript.

示例：

    <p:remoteCommand name="setData" action="#{dashBoardBean.updateWidgets}"/>

    <p:remoteCommand name="clickCount" actionListener="#{mainQueryManagerBean.clickCount}"/>

2. pe:remoteCommand

RemoteCommand enables executing backing bean methods and do partial update triggered by custom client side script.

個人示例：

function remoteDelN(id){  //delNode
	//DO NOTHING
}

<pe:remoteCommand name="remoteDelN" actionListener="#{processTempDefinitionBean.delElement}">
	<pe:assignableParam name="id" assignTo="#{processTempDefinitionBean.element.id}" />
</pe:remoteCommand>
 

(1) name: js函式名。

(2) 呼叫Java後臺方法時使用actionListener, 不能使用action, 因為action不能觸發Java方法。

(3) js需要向後臺傳遞引數時，使用pe:assignableParam.

官方示例：

Primefaces Extensions Showcase RemoteCommand:

2.1.Basic Usage

<p:commandButton value="Load" type="button" onclick="lazyload()" style="margin-bottom: 10px;"/>  
<p:outputPanel id="lazypanel" layout="block">  
    <h:outputText  
            value="This part of page is lazily loaded on demand using a RemoteCommand"  
            rendered="#{requestScope.shouldRender}" />  
</p:outputPanel>  
<pe:remoteCommand name="lazyload" update="lazypanel">  
    <f:setPropertyActionListener value="#{true}"  
                                 target="#{requestScope.shouldRender}" />  
</pe:remoteCommand>  
 

2.2.Using AssignableParam

<p:growl id="growl" showDetail="true" />  
  
<pe:remoteCommand id="applyDataCommand" name="applyData" process="@this" update="subject date circle growl"  
    actionListener="#{remoteCommandController.parametersAssigned}">  
  
    <pe:assignableParam name="subject" assignTo="#{remoteCommandController.subject}"/>  
    <pe:assignableParam name="date" assignTo="#{remoteCommandController.date}">  
        <f:convertDateTime type="both" dateStyle="short" locale="en"/>  
    </pe:assignableParam>  
    <pe:assignableParam name="circle" assignTo="#{remoteCommandController.circle}">  
        <pe:convertJson />  
    </pe:assignableParam>  
</pe:remoteCommand>  
  
<script type="text/javascript">  
    circle = {  
        radius: 50,  
        backgroundColor: "#FF0000",  
        borderColor: "#DDDDDD",  
        scaleFactor: 1.2  
    };  
    circle2 = {  
        radius: 32,  
        backgroundColor: "#FF0320",  
        borderColor: "#DDFFFD",  
        scaleFactor: 1.6  
    };  
</script>  
  
<h:outputLabel for="subject" value="Subject: " />  
<h:outputText id="subject" value="#{remoteCommandController.subject}" />  
<br/>  
<h:outputLabel for="date" value="Date: " />  
<h:outputText id="date" value="#{remoteCommandController.date}" />  
<br/>  
<h:outputLabel for="circle" value="Circle: " />  
<h:outputText id="circle" value="#{remoteCommandController.circle.radius} - #{remoteCommandController.circle.backgroundColor} - #{remoteCommandController.circle.borderColor} - #{remoteCommandController.circle.scaleFactor}" />  
<br/><br/>  
  
<p:commandButton value="Apply Data" type="button" onclick="applyData('hello world', '5/14/07 12:55:42 PM', JSON.stringify(circle))" />  
<p:commandButton value="Apply Second Data" type="button" onclick="applyData('hello user', '7/11/01 11:55:42 PM', JSON.stringify(circle2))" />

<p:growl id="growl" showDetail="true" />  
  
<pe:remoteCommand id="applyDataCommand" name="applyData" process="@this" update="growl" actionListener="#{remoteCommandController.printMethodParams}">  
    <pe:methodSignature parameters="java.lang.String, java.util.Date, org.primefaces.extensions.showcase.model.Circle" />  
    <pe:methodParam name="subject"/>  
    <pe:methodParam name="date">  
        <f:convertDateTime type="both" dateStyle="short" locale="en"/>  
    </pe:methodParam>  
    <pe:methodParam name="circle">  
        <pe:convertJson />  
    </pe:methodParam>  
</pe:remoteCommand>  
  
<script type="text/javascript">  
    circle = {  
        radius: 50,  
        backgroundColor: "#FF0000",  
        borderColor: "#DDDDDD",  
        scaleFactor: 1.2  
    };  
    circle2 = {  
        radius: 32,  
        backgroundColor: "#FF0320",  
        borderColor: "#DDFFFD",  
        scaleFactor: 1.6  
    };  
</script>  
  
<p:commandButton value="Apply Data" type="button" onclick="applyData('hello world', '5/14/07 12:55:42 PM', JSON.stringify(circle))" />  
<p:commandButton value="Apply Second Data" type="button" onclick="applyData('hello user', '7/11/01 11:55:42 PM', JSON.stringify(circle2))" />

    public void printMethodParams(final String subject, final Date date, final Circle circle) {  
        final FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "ActionListener called",  
                "Subject: " + subject + ", Date: " + date + ", Circle - backgroundColor: " + circle.getBackgroundColor());  
  
        FacesContext.getCurrentInstance().addMessage(null, msg);  
    }