AJAX nie ładuje za pierwszym kliknięciem Opcje

[tjakob]

Witam i zwracam się z prośbą pomoc w rozwiązaniu takiego oto problemu. Używam plugin Q-Tip i chcę załadować dynamicznie kod PHP do Qtip-a. Oto mój kod:

[PHP] pobierz, plaintext 
$(document).ready(function(){
$('.mapa').qtip({
	     show: 'click',
             hide: 'click',
             content:{
 
                        text: function(event, api) {
                                 $.ajax({
                                       url: '/google_maps/mapa.php'
                                       })
                                .then(function(content) {
                                   api.elements.tooltip.html(content);
                                }, function(xhr, status, error) {
                                   api.set('content.text', status + ':  ' + error);
                                });
								return 'Loading...'; 
 
                        },
                    },
		    position: {
			my: 'top right',
			at: 'top center',
			viewport: $(window)
			},
            style: {
            classes: 'qtip-blue',
 
            }
      });
});
[PHP] pobierz, plaintext 

Klikam link z id = 'mapa', aby załadować Q-Tip z kodem PHP. Pierwsze kliknięcie nie ładuje kodu, zaś drugie i kolejne kliknięcia Q-Tip działa OK. Jeśli odświeżę stronę, znowu pierwsze nie działa, następne wszystko OK. Czy ktoś może mi pomóc? Błąd popełniam w zapytaniu AJAX? Czy gdzie indziej? Bardzo dziękuję za wszelką pomoc.

[Pyton_000]

a co na to konsola przeglądarki ?

[tjakob]

Konsola przy pierwszym naciśnięciu wyrzuca

[HTML] pobierz, plaintext 
ReferenceError: google is not defined
 
 
geocoder = new google.maps.Geocoder();
 
 
[HTML] pobierz, plaintext 

czyli odnosi się do skryptu, który ma się załadować w Qtip, przy następnym naciśnięciu już błędu nie ma i jest OK.
To jest ten skrypt pobrany z google maps API

[HTML] pobierz, plaintext 
    <script type='text/javascript'>
 
    //This javascript will load when the page loads.
    jQuery(document).ready( function($){
 
            //Initialize the Google Maps
            var geocoder;
            var map;
 
            var markersArray = [];
            var infos = [];
 
            geocoder = new google.maps.Geocoder();
            var myOptions = {
 
				 zoomControl: false,
				 scaleControl: false,
				 disableDefaultUI: true,
                 // mapTypeId: google.maps.MapTypeId.ROADMAP				  
				  }
            //Load the Map into the map_canvas div
                 var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
			     google.maps.event.addDomListener(window, 'load', function () {
                 map.setZoom(0);
                 });
 
            //Initialize a variable that the auto-size the map to whatever you are plotting
            var bounds = new google.maps.LatLngBounds();
 
            //Initialize the encoded string       
            var encodedString;
            //Initialize the array that will hold the contents of the split string
            var stringArray = [];
            //Get the value of the encoded string from the hidden input
            encodedString = document.getElementById("encodedString").value;
            //Split the encoded string into an array the separates each location
            stringArray = encodedString.split("****");
 
            var x;
            for (x = 0; x < stringArray.length; x = x + 1)
            {
                var addressDetails = [];
                var marker;
                //Separate each field
                addressDetails = stringArray[x].split("&&&");
                //Load the lat, long data
                var lat = new google.maps.LatLng(addressDetails[1], addressDetails[2]);
                //Create a new marker and info window
				var image = '/google_maps/icons/pin.png';
                marker = new google.maps.Marker({
                    map: map,
                    position: lat,
					icon: image,
                    //Content is what will show up in the info window
                    content: addressDetails[0]
                });
                //Pushing the markers into an array so that its easier to manage them
                markersArray.push(marker);
                google.maps.event.addListener( marker, 'click', function () {
                    closeInfos();
                    var info = new google.maps.InfoWindow({content: this.content});
                    //On click the map will load the info window
                    info.open(map,this);
                    infos[0]=info;
                });
               //Extends the boundaries of the map to include this new location
               bounds.extend(lat);
            }
            //Takes all the lat, longs in the bounds variable and autosizes the map
            map.fitBounds(bounds);
 
            //Manages the info windows
            function closeInfos(){
           if(infos.length > 0){
              infos[0].set("marker",null);
              infos[0].close();
              infos.length = 0;
           }
            }
 
    });
    </script>
[HTML] pobierz, plaintext 

ale teraz to już wogóle O.o

Ten post edytował tjakob 22.02.2016, 13:39:40