Automatically query MySQL and output results with AJAX

Question

I have a problem to display my gps coords automatically on a google map. when I implement that the map is static everything works fine, but now I try it dynamically. that means when a new gps coord will be saved to a database, the map should refresh automatically.

I implemented everything in one .php file. To show a map with coords the user must to select a entry, the link to a entry looks like this -> http://trackmyrun1.at/index.php?page=show_runs&data1=get&data2=1

    <?php
    $result = mysql_query("SELECT * FROM fifa_gps WHERE run_id=".$_GET['data2'].""); 

    while ($line = mysql_fetch_array($result)) {
    $cords[] = "new google.maps.LatLng(" . $line['lat'] . ", " . $line['longt'] . "),";
    }

    $cord_start = explode("(", $cords[0]);
    $cord_pos_start = explode(")", $cord_start[1]);

    $cord_end = explode("(", $cords[count($cords)-1]);
    $cord_pos_end = explode(")", $cord_end[1]);

    echo $sys->overall_distance($_GET['data2']);
    ?>    

    <div id="map-canvas" style="height:400px"/>
    <script type="text/javascript">
    var seconds = 1;
    var divid = "map-canvas";
    var url = "http://localhost/alt/FIFA-Europaliga/index.php?page=show_runs&data1=get&data2=<?php echo $_GET['data2']; ?>";

            function refreshdiv(){

            // The XMLHttpRequest object

            var xmlHttp;
            try{
            xmlHttp=new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari
            }
            catch (e){
            try{
            xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); // Internet Explorer
            }
            catch (e){
            try{
            xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (e){
            alert("Your browser does not support AJAX.");
            return false;
            }
            }
            }

            // Timestamp for preventing IE caching the GET request

            fetch_unix_timestamp = function()
            {
            return parseInt(new Date().getTime().toString().substring(0, 10))
            }

            var timestamp = fetch_unix_timestamp();
            var nocacheurl = url+"?t="+timestamp;

            // The code...

            xmlHttp.onreadystatechange=function(){
            if(xmlHttp.readyState==4){
            document.getElementById(divid).innerHTML=xmlHttp.responseText;
            setTimeout('refreshdiv()',seconds*1000);
            }
            }
            xmlHttp.open("GET",nocacheurl,true);
            xmlHttp.send(null);
            }

            // Start the refreshing process

            var seconds;
            window.onload = function startrefresh(){
            setTimeout('refreshdiv()',seconds*1000);
            }
            <!--
    refreshdiv();
    // -->
    </script>
    <script type="text/javascript">
    function initialize() {
    var myLatLng = new google.maps.LatLng(<?php echo $cord_pos_start[0]; ?>);
    var mapOptions = {
        zoom: 15,
        center: myLatLng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

    var flightPlanCoordinates = [
        <?php echo implode('', $cords); ?>
    ];

    var image_start = 'http://labs.google.com/ridefinder/images/mm_20_green.png';

    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        title:"Start",
        icon: image_start       
    });

    var image_end = 'http://labs.google.com/ridefinder/images/mm_20_red.png';

    var endMarker = new google.maps.Marker({
        position: new google.maps.LatLng(<?php echo $cord_pos_end[0]; ?>),
        map: map,
        title:"Ende",
        icon: image_end     
    });

    var flightPath = new google.maps.Polyline({
        path: flightPlanCoordinates,
        strokeColor: "#FF0000",
        strokeOpacity: 0.5,
        strokeWeight: 5
    });

    flightPath.setMap(map);
    }
    initialize();
    </script>
  ....

Before the first refresh I see the Map and the path on it and after one refresh I get this error:

Warning: mysql_fetch_array() expects parameter 1 to be resource, boolean given in C:\\xampp\\htdocs\\Alt\\FIFA-Europaliga\\content\\show_runs.php on line 4

Notice: Undefined variable: cords in C:\\xampp\\htdocs\\Alt\\FIFA-Europaliga\\content\\show_runs.php on line 8

Notice: Undefined offset: 1 in C:\\xampp\\htdocs\\Alt\\FIFA-Europaliga\\content\\show_runs.php on line 9

Notice: Undefined variable: cords in C:\\xampp\\htdocs\\Alt\\FIFA-Europaliga\\content\\show_runs.php on line 11

Can somebody help me?

Answer 1

Before you can run a query, you must connect to the server and select a database.

$db = mysql_connect('hostname|ip', 'user', 'password');
mysql_select_db('database_name', $db);
$result = mysql_query('SELECT ...', $db);

If a query fails, mysql_query will return false, which explains the error about expecting a resource and getting a boolean.

The warning you're getting about mysql_fetch_array needing a resource means that the query is failing. Reasons it may fail include:

1. Not connected to the correct database
2. Missing permissions on the database
3. Table doesn't exist, is mistyped, etc
4. Mistyped fields, query, etc. (bad query)

In all cases, you can check the error by printing out mysql_error() .