primefaces GMap示例不工作，不知道爲什麼

Question

我有gmap4jsf的問題。下面的代碼：

<f:view contentType="text/html"> 
     <h:form id="form"> 
      <p:growl id="msg" showDetail="true"/> 
         <p:gmap id="gmap" center="36.890257,30.707417" zoom="13" type="HYBRID" 

           style="width:600px;height:400px" 
           model="#{addPlaceBean.emptyModel}" 
           onPointClick="handlePointClick(event);" 
           widgetVar="map" disableDoubleClickZoom="true"> 

         </p:gmap> 

         <p:dialog widgetVar="dlg"> 
          <h:form prependId="false"> 
           <h:panelGrid columns="1"> 
            <h:outputLabel value="Are you sure?"/> 


            <f:facet name="footer"> 
             <p:commandButton value="Yes" 
                 actionListener="#{addPlaceBean.addMarker}" 
                 update=":form:msg" 
                 oncomplete="markerAddComplete()"/> 
             <p:commandButton value="Cancel" onclick="return cancel()"/> 
            </f:facet> 
           </h:panelGrid> 

           <h:inputHidden id="lat" value="#{addPlaceBean.lat}"/> 
           <h:inputHidden id="lng" value="#{addPlaceBean.lng}"/> 
          </h:form> 
         </p:dialog> 

         <script type="text/javascript"> 
          var currentMarker = null; 

          function handlePointClick(event) { 

           console.log("click event"); 

           console.log(event.marker); 

           if (currentMarker == null) { 
            document.getElementById('lat').value = event.latLng.lat(); 
            document.getElementById('lng').value = event.latLng.lng(); 

            currentMarker = new google.maps.Marker({ 
             position: new google.maps.LatLng(event.latLng.lat(), event.latLng.lng()) 
            }); 

            map.addOverlay(currentMarker); 

            dlg.show(); 
           } 
          } 

          function markerAddComplete() { 
         //currentMarker = null; Only one can be added. 
           dlg.hide(); 
          } 

          function cancel() { 
           dlg.hide(); 
           currentMarker.setMap(null); 
           currentMarker = null; 

           return false; 
          } 
         </script> 
      </h:form> 
    </f:view> 

這裏的支持bean：

public void addMarker(ActionEvent actionEvent) { 
    System.err.println("Adding marker"); 
    Marker marker = new Marker(new LatLng(lat, lng), title); 
    emptyModel.addOverlay(marker); 

    addMessage(new FacesMessage(FacesMessage.SEVERITY_INFO, "Marker Added", "Lat:" + lat + ", Lng:" + lng)); 
} 

，你可以看到，它是從primefaces「添加標記」例如，使用GMAP的拍攝。我使用的素數是3.5。問題是，當我雙擊地圖添加標記時，沒有任何反應！ addMarker(ActionEvent actionEvent)未執行，並且javascript函數handlePointClick(event)正在執行，直到currentMarker = new google.maps.Marker({ position: new google.maps.LatLng(event.latLng.lat(), event.latLng.lng()) });行，然後中斷（使用警報進行檢查 - 它不會在此行後顯示）。沒有發現異常。坦率地說，我不知道發生了什麼（JavaScript知識不是我的好方面）。我試圖刪除p:dialog中的<h:form>標籤，但它不起作用。當我將disableDoubleClickZoom屬性更改爲false時，地圖正在放大，而不是顯示對話框。

你能告訴我我做錯了什麼或給我一個很好的例子嗎？

在此先感謝。

Answer 1

好的，

我做到了。具體方法如下：

<p:gmap model="#{addPlaceBean.emptyModel}" center="41.381542, 2.122893" zoom="10" type="ROADMAP" style="width:600px;height:600px" id="map"> 
     <p:ajax event="pointSelect" listener="#{addPlaceBean.onPointSelect}" update="msg map" /> 
     <p:ajax event="overlaySelect" listener="#{addPlaceBean.onMarkerSelect}" update="msg" /> 
    </p:gmap> 

而且在支持bean：

public void onPointSelect(PointSelectEvent event) { 
    System.out.println("Add marker title: " + title); 
    LatLng latlng = event.getLatLng(); 
    addMessage(new FacesMessage(FacesMessage.SEVERITY_INFO, "Dodano marker.", "")); 
    emptyModel = new DefaultMapModel(); 
    Marker marker = new Marker(latlng, title); 
    emptyModel.addOverlay(marker); 
} 

Answer 2

更換

document.getElementById('lat').value = event.latLng.lat(); 

通過

document.getElementById('form:lat').value = event.latLng.lat();