4

我正在开发一个 Web 应用程序，我使用 JSF 和 PrimeFaces 框架以及外部 Geo Map API。

POI_id当我点击地图上的 POI 时，地图 API 会显示给我。但这对我来说还不够，我想从 servlet 中获取有关 POI 的信息并将其显示在弹出窗口中。（地址、姓名、电话号码等字段）。

因此，当我单击地图上的 POI 时，我需要向托管 bean 中的 servlet 发送 HTTP 请求。

我可以得到poi_id，但我无法将此 id 发送到后端托管 bean，因此似乎无法获取 POI 信息。

如何发送poi_id到我的托管 bean 并处理响应以显示在弹出窗口中？

4

2 回答 2

21

您可以使用PrimeFaces 远程命令组件( <p:remoteCommand>)。

RemoteCommand 允许执行支持 bean 方法并执行由自定义客户端脚本触发的部分更新。

通过以下方式将其添加到视图中：

<p:remoteCommand name="myRemote" actionListener="#{myBean.listen}"/>

并像这样在Javascript中使用它：

<script type="text/javascript">
   myRemote(); //makes a remote call
</script>

或从事件处理程序中调用它，如下所示：

<div onclick="myremote();">...</div>

如果您还想将参数传递给服务器，请进行以下调用：

<script type="text/javascript">
   myRemote([{name:'param1', value:150}, {name:'param2', value:220}]); //makes a remote call with parameters
</script>

听众可能是这样的：

public void listen(){
    FacesContext context = FacesContext.getCurrentInstance();
    Map<String,String> params = context.getExternalContext().getRequestParameterMap();
    System.out.println(params.get("param1"));
    System.out.println(params.get("param2"));
}

其中一条评论要求将值返回给 Javascript。
那么在这种情况下，您可以使用 Primeface 的Request Context的execute()方法来执行您想要的任何 javascript。 

RequestContext.getCurrentInstance().execute("your javascript code");
于 2013-09-24T08:22:48.567 回答
12

Just to add to Kishor's (halfway) answer, you need to have a to-be-updated component in your view (popup window as you call it) and ajax-update it after the request has been successfully completed.

You can use remote command to send the AJAX request with an extra parameter attached and ajax-update the JSF component responsible to be a popup window. Like so (for PrimeFaces 3.x):

<p:remoteCommand name="myRemote" actionListener="#{myBean.listen}" 
                 update="dialog" oncomplete="dlg.show()" />
...
<div onclick="myremote([{name:'poi_id', value:poi_id}]);">...</div>
...
<p:dialog id="dialog" widgetVar="dlg">
    <h:outputText value="#{myBean.address}" />
    ...(display other information)
</p:dialog>

with

String address;
public void listen(){
    String poi_id = FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap().get("poi_id");
    address = getAddress(poi_id);
}

The alternative to using a remote command is to have a hidden form with a hidden input that will be used to transmit the parameter to the backing bean, that could be separated from other beans to handle the retrieval of necessary information based on your poi_id:

<h:form id="poi-form" styleClass="invisible">
    <h:inputHidden id="poi" value="#{poiBean.poi}" />
    <p:commandButton id="info" action="#{poiBean.info}"
                     update="dialog" oncomplete="dlg.show()" />
</h:form>
<div onclick="document.getElementById('poi-form:poi').value = poi_id; 
              document.getElementById('poi-form:info').click();">...</div>
...
<p:dialog id="dialog" widgetVar="dlg">
    <h:outputText value="#{poiBean.address}" />
    ...(display other information)
</p:dialog>

with

@ManagedBean
@RequestScoped
public class PoiBean {

    private String poi;//getter+setter
    private String address;//getter
    //other properties

    public void listen(){
        address = getAddress(poi);
        //other properties
    }

}
于 2013-09-24T09:54:59.523 回答