Saturday, 15 June 2013

jsf - How to create a draggable marker? -



jsf - How to create a draggable marker? -

code below it's able create marker.

but want create draggable marker, problem is not sending click event server after marker has been created.

when markes created draggable flag set true.

any ideas?

class="lang-html prettyprint-override"><p:gmap id="gmap" center="36.890257,30.707417" zoom="13" type="hybrid" style="width:600px;height:400px" model="#{mapbean.emptymodel}" onpointclick="handlepointclick(event);" widgetvar="map"> <p:ajax event="markerdrag" listener="#{mapbean.onmarkerdrag}" update="messages" /> </p:gmap> <p:dialog widgetvar="dlg" effect="fade" effectduration="0.5" close="false" fixedcenter="true"> <h:form prependid="false"> <h:panelgrid columns="1"> <h:outputlabel value="are sure?"/> <f:facet name="footer"> <p:commandbutton value="yes" actionlistener="#{mapbean.addmarker}" update=":messages" oncomplete="markeraddcomplete()"/> <p:commandbutton value="cancel" onclick="return cancel()"/> </f:facet> </h:panelgrid> <h:inputhidden id="lat" value="#{mapbean.lat}"/> <h:inputhidden id="lng" value="#{mapbean.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; 1 can added. dlg.hide(); } function cancel() { dlg.hide(); currentmarker.setmap(null); currentmarker = null; homecoming false; } </script>

problem beingness caused attribute onpointclick of p:gmap. javascript callback function handlepointclickevent() in case.

so setted attribute el expression, after creating marker, look evaluate null, component p:gmap updates in ajax call, , draggable events work ;)

jsf primefaces primefaces-gmap

No comments:

Post a Comment