jQuery / AJAX / php encoding nightmare - php

Question

First of all, my database encoding is utf-8.
I must send the string Fußball to index.php via the POST method. When I send it using an HTML form with action="index.php", it is sent as Fu%DFball and to return it correctly I use htmlentities() on the php file. It works great. The problem starts when I try to send it using jQuery/AJAX.
$("#Form").submit(function() {
$.ajax({
type: "POST",
dataType : "text",
url: "index.php", //Does the validation
data: $("#Form").serialize(),
success: function(data) {
alert(data)
},
});
return false;
});
It is sent as Fu%C3%9Fball and returned as Fuà and I tried everything to decode it or send it in a different way. Here is what is returned in various scenarios:
Sending normally, with htmlentities() on the php file:
FuÃ
Sending normally, without htmlentities() or with htmlspecialchars() on the php file
Fußball
Sending normally, with utf8_decode() on the php file
Fu
Using escape(), encodeURIComponent() or contentType: "utf-8" on the jQuery script before sending the string makes the form to be submitted in a way the .php file can't understand, but not only that, it still sends the string as Fu%C3%9Fball.
I also used the proper command for each file type to encode all my documents as utf-8, which didn't make any difference so I assume it was all utf-8 to start with.

Answer 1

Make sure your web page's encoding is also UTF-8.
If it is ISO-8859-1 by default, it'll parse UTF-8 characters wrongly, as experienced by you.
To check, look in your browser's "encoding" menu when opening the page: That's the final word on what encoding is used.
It could be that your server is configured to output ISO-8859-1 content type headers for HTML files. See How to change the default encoding to UTF-8 for Apache? for how to fix that.