Posting data to database through javascript causes encoding problems

Question

I'm sorry if there is another similar post, but it is hard to formalize a question with my problem. So I have a page with Google maps and two forms which can add points on map with extra information. One form working very well, another not so well. My language is lithuanian, so I have some special characters like 'ąčęėįšųū', and with second form after submit I have bad values in database like '%u0117%u0161'.

In the image Number 1., this form working well. Number 2. is the form which makes encoding problems, and Number 3. is the result after submit form number 2.

For the second form I used Google tutorial (https://developers.google.com/maps/articles/phpsqlinfo_v3), and edited some small things.

So I would be grateful if someone will help me to solve this.

Javascript code:

 function initMap() {
 map = new google.maps.Map(document.getElementById("map"), {
 zoom: 0,
 center: new google.maps.LatLng(55.203953, 24.873047),
 mapTypeId: google.maps.MapTypeId.ROADMAP,
 mapTypeControl: true,
 panControl: true,
 mapTypeControlOptions: {
 style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
 },
 navigationControl: true,
 navigationControlOptions: {
 style: google.maps.NavigationControlStyle.SMALL
 }
 }); 


 var html = "<table>" +
                 "<tr><td>Pavadinimas:</td> <td><input type='text' name='name' id='name'/> </td> </tr>" +
                 "<tr><td>Miestas:</td> <td><input type='text' name='city' id='city'/></td> </tr>" +
                 "<tr><td>Adresas:</td> <td><input type='text' name='adress' id='adress'/></td> </tr>" +
                 "<tr><td>Apibudinimas:</td> <td><input type='text' name='description' id='description'/></td> </tr>" +
                 "<tr><td>Type:</td> <td><select id='type'>" +
                 "<option value='Baras' SELECTED>Baras</option>" +
                 "<option value='Restoranas'>Restoranas</option>" +
                 "<option value='Degalinė'>Degalinė</option>" +
                 "</select> </td></tr>" +
                 "<tr><td></td><td><input type='button' value='Save & Close' onclick='saveData()'/></td></tr>";

    infowindow = new google.maps.InfoWindow({
     content: html
    });

    google.maps.event.addListener(map, "click", function(event) {
        marker = new google.maps.Marker({
          position: event.latLng,
          map: map
        });
        google.maps.event.addListener(marker, "click", function() {
          infowindow.open(map, marker);
        });
    });

 center = bounds.getCenter();
 map.fitBounds(bounds); 

  }

  function saveData() {
      var name = escape(document.getElementById("name").value);
      var adress = escape(document.getElementById("adress").value);
      var city = escape(document.getElementById("city").value);
      var description = escape(document.getElementById("description").value);
      var type = document.getElementById("type").value;
      var latlng = marker.getPosition();

      var url = "phpsqlinfo_addrow.php?name=" + name + "&adress=" + adress + "&city=" + city +
      "&description=" + description + "&type=" + type + "&lat=" + latlng.lat() + "&lon=" + latlng.lng();
      downloadUrl(url, function(data, responseCode) {
        if (responseCode == 200 && data.length <= 1) {
          infowindow.close();
          document.getElementById("message").innerHTML = "Location added.";
        }

      });

     $(document).ready(function() {
        setTimeout("ReloadPage()", 100);
        });

    }

      function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request.responseText, request.status);
        }
      };

      request.open('GET', url, true);
      request.send(null);

    }

    function ReloadPage() {
   location.reload();
};


    function doNothing() {}

PHP insert code:

require("controller/phpsqlinfo_dbinfo.php");

// Gets data from URL parameters
$name = $_GET['name'];

$adress = $_GET['adress'];

$city = $_GET['city'];

$description = $_GET['description'];

$lat = $_GET['lat'];

$lon = $_GET['lon'];

$type = $_GET['type'];


// Opens a connection to a MySQL server
$connection=mysql_connect ("localhost", $dbuser, $dbpass);
if (!$connection) {
  die('Not connected : ' . mysql_error());
}

// Set the active MySQL database
$db_selected = mysql_select_db($dbname, $connection);
if (!$db_selected) {
  die ('Can\'t use db : ' . mysql_error());
}

// Insert new row with user data

//$submit="INSERT INTO poi_example (id, name, city, adress, description, lat, lon, type) VALUES (NULL,'$name','$city', '$adress','$description','$lat','$lon','$type');";

$query = sprintf("INSERT INTO poi_example " .
         " (id, name, adress, city, description, lat, lon, type ) " .
         " VALUES (NULL, '%s', '%s', '%s', '%s', '%s', '%s', '%s');",
         mysql_real_escape_string($name),
         mysql_real_escape_string($adress),
          mysql_real_escape_string($city),
         mysql_real_escape_string($description),
         mysql_real_escape_string($lat),
         mysql_real_escape_string($lon),
         mysql_real_escape_string($type));

$result = mysql_query($query);


//print_r($result);

if (!$result) {
  die('Invalid query: ' . mysql_error());
}

?>

Answer 1

Is it possible that your (local?) database is not configured to use the right encoding? I think UTF-8 for example may be better suited for lithuanian. I think the standard encoding of MySQL ist somthing like latin1? It's just a guess, but you may have to check that.