Gmap Primefaces Geocode自定义错误消息

时间:2017-08-25 23:19:00

标签: javascript google-maps primefaces jsf-2

我使用p:gmap跟踪Primefaces展示地理编码功能,如果我输入一个真实的地址,它没问题,但如果我把无效地址没有任何反应,我只收到了chrome console" Geocode not found",但我必须抓住该事件,以便向用户显示自定义消息。

仔细观察我在Primefaces库中找到了gmap.js,并且启动了一个Primefaces.error(" Geocode not found"),但我还有问题,我怎么能抓住它? / p>

我正在使用Primefaces 5.2

@Html.DropDownList("LayoutsDDL", new SelectList(Model.Layouts, "LayoutID", "LayoutName"));

@Html.DropDownList("CategoriesDDL", new SelectList(Model.Categories, "CategoryID", "CategoryName"));

和Javascript功能:

<p:gmap 
  widgetVar="w_gmap_edit" 
  id="gmapId_edit" 
  center="#{tiendasController.centerGeoMap}" 
  zoom="15" 
  type="ROADMAP" 
  style="width:400px;height:450px"
  model="#{tiendasController.mapModel}" 
  onPointClick="handlePointClick_edit(event)"
>
  <p:ajax 
    event="geocode" 
    listener="#{tiendasController.onGeoCodeAction}" 
    onstart="onCompleteGeoCodeEdit(xhr, status, args)"
    update="@this center-form:tiendas-editar-latitud-value center-form:tiendas-editar-longitud-value"
  />
</p:gmap>

1 个答案:

答案 0 :(得分:0)

你试过这个:

查看元素

<a:row> <a:label value="" span="2"/> <p:commandButton value="#{bundleCommun.btn_recherche}" icon="ui-icon-search" onclick="geocode();" type="button" /> </a:row> <p:gmap id="geoGmap" widgetVar="geoMap" center="#{addHubController.centerGeoMap}" zoom="12" type="ROADMAP" model="#{addHubController.geoModel}" onPointClick="handlePointClick(event);" style="width:100%;height:400px"> <p:ajax event="geocode" listener="#{addHubController.onGeocode}" update="@this" /> </p:gmap>

脚本

<script>
    function geocode() {

        var map=PF('geoMap').getMap();//PERFECT

        var address=document.getElementById('form:address').value;//PERFECT

        var geocoder = new google.maps.Geocoder();//PERFECT

        geocoder.geocode({'address': address}, function(results, status) {

            if (status === 'OK') {
                map.setCenter(results[0].geometry.location);
                var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location
                });
            } else {
                alert('CUSTOMIZED ERROR MESSAGE');
            }
        });
</script>

PRIMEFACES GMAP / GOOGLE MAP API, GEOCODE TUTORIAL

这对我来说非常好。祝你好运