2014-09-05 84 views
0

我正在devolopping一個網站,JSF,我struglling到implment新PORTO模板,現在我在聯繫我們頁面,它有一個在我執行時沒有出現的地圖,我不知道爲什麼,而我在JS中有點虛弱。 所以請幫助我!波爾圖模板:谷歌地圖顯示不出來

.xhtml:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" 
xmlns:ui="http://java.sun.com/jsf/facelets" 
xmlns:h="http://java.sun.com/jsf/html" 
xmlns:f="http://java.sun.com/jsf/core" 
xmlns:p="http://primefaces.org/ui"> 

<h:head> 
<script src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script src="vendor/jquery.gmap.js"></script> 

<script> 
    /* 
    Map Settings 

     Find the Latitude and Longitude of your address: 
      - http://universimmedia.pagesperso-orange.fr/geo/loc.htm 
      - http://www.findlatitudeandlongitude.com/find-address-from-latitude-and-longitude/ 

    */ 

    // Map Markers 
    var mapMarkers = [ { 
     address : "New York, NY 10017", 
     html : "<strong>New York Office</strong><br/>New York, NY 10017", 
     icon : { 
      image : "img/pin.png", 
      iconsize : [ 26, 46 ], 
      iconanchor : [ 12, 46 ] 
     }, 
     popup : true 
    } ]; 

    // Map Initial Location 
    var initLatitude = 40.75198; 
    var initLongitude = -73.96978; 

    // Map Extended Settings 
    var mapSettings = { 
     controls : { 
      panControl : true, 
      zoomControl : true, 
      mapTypeControl : true, 
      scaleControl : true, 
      streetViewControl : true, 
      overviewMapControl : true 
     }, 
     scrollwheel : false, 
     markers : mapMarkers, 
     latitude : initLatitude, 
     longitude : initLongitude, 
     zoom : 16 
    }; 

    var map = $("#googlemaps").gMap(mapSettings); 

    // Map Center At 
    var mapCenterAt = function(options, e) { 
     e.preventDefault(); 
     $("#googlemaps").gMap("centerAt", options); 
    } 
</script> 
</h:head> 
<h:body> 
<ui:composition template="/WEB-INF/Publique/template.xhtml"> 
    <ui:define name="title">Corporate Software : Nous Contactez </ui:define> 
    <ui:define name="content"> 
     <div role="main" class="main"> 

      <section class="page-top"> 
      <div class="container"> 
       <div class="row"> 
        <div class="col-md-12"> 
         <ul class="breadcrumb"> 
          <li><a href="index">Acceuil</a></li> 
          <li class="active">Nous Contactez</li> 
         </ul> 
        </div> 
       </div> 
       <div class="row"> 
        <div class="col-md-12"> 
         <h2>Nous Contactez</h2> 
        </div> 
       </div> 
      </div> 
      </section> 

      <!-- Google Maps --> 
      <div id="googlemaps" class="google-map hidden-xs"></div> 

      <div class="container"> 

       <div class="row"> 
        <div class="col-md-6"> 

         <div class="alert alert-success hidden" id="contactSuccess"> 
          <strong>Succés!</strong> Nous avons reçus votre message. 
         </div> 

         <div class="alert alert-danger hidden" id="contactError"> 
          <strong>Erreure!</strong> Une Erreure c'est produite lors du 
          l'envois de votre message. 
         </div> 

         <h2 class="short"> 
          Nous <strong>Contactez</strong> 
         </h2> 

         <h:form id="form1"> 
          <div class="row"> 
           <div class="form-group"> 
            <div class="col-md-6"> 
             <label>Nom Complet *</label> 
             <h:inputText type="text" 
              value="#{messageMBean.message.nomComplet}" 
              data-msg-required="Entrer votre nom s'il vous plait." 
              maxlength="100" class="form-control" name="name" id="name" /> 
            </div> 
            <div class="col-md-6"> 
             <label>Votre email *</label> 
             <h:inputText type="email" 
              value="#{messageMBean.message.email}" 
              data-msg-required="Entrer votre email s'il vous plait." 
              data-msg-email="Entrer un email valide s'il vous plait." 
              maxlength="100" class="form-control" name="email" id="email" /> 
            </div> 
           </div> 
          </div> 
          <div class="row"> 
           <div class="form-group"> 
            <div class="col-md-12"> 
             <label>Sujet *</label> 
             <h:inputText type="text" 
              value="#{messageMBean.message.objet}" 
              data-msg-required="Please enter the subject." 
              maxlength="100" class="form-control" name="subject" 
              id="subject" /> 
            </div> 
           </div> 
          </div> 
          <div class="row"> 
           <div class="form-group"> 
            <div class="col-md-12"> 
             <label>Message *</label> 
             <h:inputTextarea maxlength="5000" 
              value="#{messageMBean.message.textMessage}" 
              data-msg-required="Entrer votre message s'il vous plait." 
              rows="10" class="form-control" name="message" id="message" /> 
            </div> 
           </div> 
          </div> 
          <div class="row"> 
           <div class="col-md-12"> 
            <h:commandButton value="Envoyer" 
             actionListener="#{messageMBean.save}" 
             class="btn btn-primary btn-lg"> 
             <p:ajax update="form1" /> 
            </h:commandButton> 
           </div> 
          </div> 
         </h:form> 

        </div> 
        <div class="col-md-6"> 

         <h4 class="push-top"> 
          Get in <strong>touch</strong> 
         </h4> 
         <p> 
          Si vous êtes interéssés par nos services, ou bien vous voulez 
          faire partie de notre equipe, ou vous avez n'import quelle 
          Question!! <strong>N'hesitez pas !</strong> 
         </p> 

         <hr /> 

         <h4> 
          Notre <strong>Agence</strong> 
         </h4> 
         <ul class="list-unstyled"> 
          <li><i class="icon icon-map-marker"></i> <strong>Addresse:</strong> 
           6 bis, rue Najib Mahfoud, Casablanca</li> 
          <li><i class="icon icon-phone"></i> <strong>TéléPhone:</strong> 
           0212 522 266 545/90</li> 
          <li><i class="icon icon-envelope"></i> <strong>Email:</strong> 
           <a href="mailto:[email protected]">[email protected]</a></li> 
         </ul> 

         <hr /> 

         <h4> 
          <strong>Heurs</strong> de Travail 
         </h4> 
         <ul class="list-unstyled"> 
          <li><i class="icon icon-time"></i> Lundi - Vendredi 9am to 
           5pm</li> 
          <li><i class="icon icon-time"></i> Samedi - 9am to 2pm</li> 
          <li><i class="icon icon-time"></i> Dimanche - Fermé</li> 
         </ul> 

        </div> 

       </div> 

      </div> 

     </div> 

     <section class="call-to-action featured footer"> 
     <div class="container"> 
      <div class="row"> 
       <div class="center"> 
        <h3> 
         Corporate Software, c'est <strong>tous</strong> ce dont vous avez 
         <strong>besoin</strong>! <a 
          href="http://themeforest.net/item/porto-responsive-html5-template/4106987" 
          target="_blank" class="btn btn-lg btn-primary" 
          data-appear-animation="bounceIn">Contactez Nous!</a> <span 
          class="arrow hlb" data-appear-animation="rotateInUpLeft" 
          style="top: -22px;"></span> 
        </h3> 
       </div> 
      </div> 
     </div> 
     </section> 
    </ui:define> 
</ui:composition> 

----------- ----------- EDITED

我想我明白髮生了什麼,但不知道如何撤消它!

當xhtml被解析爲html之間的任何東西之間<script>標籤變成評論之間<!-- -->我查了一下,它似乎有某種黑客攻擊對策!!!,但我不知道如何禁用它。

任何想法!! 想你。

回答

0

我發現這個解決方案非常簡單,我教過的這個解決方案應該可以在任何人需要的情況下共享。

您在您的項目中創建新的JavaScript文件,並在其中複製JS代碼寫入xhtml文件。

然後將它包含在頭部的<script src="file.js"></script>的xhtml中,然後瞧!

它的工作!