0

I am using the Google Places API to supply my application with a list of cities, countries, etc for a dropdown menu. I use an AJAX request to a file containing this code:

$results = file_get_contents("https://maps.googleapis.com/maps/api/place/autocomplete/json?types=(regions)&language=EN&offset=4&key=" . $key . "&input=" . $input);
    $decode = json_decode($results, true);

    foreach($decode["predictions"] as $value){
        $json_array[] = $value["description"];
    }

    echo json_encode($json_array);

Everything seems to work okay on this side of things, however when the JSON is returned to the AJAX application, some of the characters appear incorrectly. For example, the "ã" in "São Paulo" appears as ",," or "S,,o Paulo" when I try to display the results. If I alert the result, the characters do display correctly in the pop-up - so I seem to be missing something when I give the results to the javascript to display in the drop down. (What also is irritating is that the incorrectly coded results end up getting entered into my database when the user selects from the drop down.)

I have tried encoding each string with "utf8_encode()" before I add it to "$json_array" (in the PHP file, of course), but this only seems to complicate things - it appears that the results are double-encoded or something when it is finally displayed in the javascript.

Also, I should note that the web page has the UTF-8 charset in the meta tag.

As a follow-up:

I created a simple HTML page which in which I displayed "ã" in a div, and it did show up properly. I also used jQuery to display the same character in another div on page load, and this too showed up correctly. And I didn't even need to set the encoding on that page. So I can only assume, because this test page is plain vanilla HTML, that the problem is coming from my PHP set-up.

I have added the following to the head of another PHP tests page:

mb_internal_encoding("UTF-8");
mb_http_output("UTF-8");
mb_http_input("UTF-8");
mb_language("uni");
mb_regex_encoding("UTF-8");
ob_start("mb_output_handler");
header("Content-Type: text/html; charset=UTF-8");

but I am still seeing the characters incorrectly displayed. So to this point I have added the above, updated the default_encoding to UTF-8 in php.ini, and checked that the meta tag specifies UTF-8. This is really starting to irritate me now!

mimewear
  • 33
  • 2
  • 10
  • What is the encoding of the PHP file? And is your HTML document in UTF-8? Have you set the meta tag for it? – x4rf41 Aug 08 '15 at 16:42

3 Answers3

0

use one of either header:

header('Content-type: application/json');
header('Content-Type: text/html; charset=UTF-8);

work for me in case of Arabic language.

Kaleem Ullah
  • 6,799
  • 3
  • 42
  • 47
  • Thanks, but still the same result. "alert(string)" displays correctly, while something like: " '
    ' + string + '
    ' " displays incorrectly - regardless of the header from the PHP output.     – mimewear Aug 08 '15 at 16:50
0

It might be that the webpage is not recognizing the character. To fix this, use HTML code for this character.

For example, the HTML code for ã is ã.

You can find more information on this here.

Check for special characters in your PHP string and convert these.

$mystring = 'São Paulo';
$findme   = 'ã';
$pos = strpos($mystring, $findme);

if ($pos != false) $findme = "ã";
Chris
  • 1,574
  • 4
  • 16
  • 49
  • Thanks. Would I need to convert/encode the characters from the PHP file or in the javascript after it is returned? (Because the results are coming from Google, I would need to somehow have the characters automatically convert/encode.) Javascript does not seem to have any good functions for doing this. Also, from what I understand, special characters are encoded in the "json_encode()" function before it is passed back to the AJAX application, so I would have thought that "ã" would be further muddled? – mimewear Aug 08 '15 at 17:00
  • Well, I have just tried to display "ã" on the page in the regular HTML (not in the javascript), and it displays incorrectly there as well. So it is not the encoding from the PHP, etc. I am confused as I already have the charset as UTF-8, so why won't it display properly? – mimewear Aug 08 '15 at 17:12
  • I have tried both of these tags: "" and "" - neither have an effect. I also added "header("Content-Type: text/html; charset=UTF-8");" before any output. – mimewear Aug 08 '15 at 17:41
  • Also, I have set the default_charset to UTF-8 in the php.ini – mimewear Aug 08 '15 at 17:58
  • Could you maybe try the answer as posted [here](http://stackoverflow.com/questions/3589358/fix-incorrectly-displayed-encoding-on-an-html-document-with-php). – Chris Aug 08 '15 at 18:15
0

This was the dumbest thing... but I learned a lot about character encoding along the way. It turns out (and I didn't mention this at all because it just didn't seem relevant) that the Helvetica fonts in Bootstrap cannot display these special characters. Yeah, wtf? I had every possible encoding option set to "UTF-8", and all along it was just the stupid CSS font selection. So in the end I just changed the font family to "Arial" and instantly the problem was solved.

Thank to everyone for the input.

mimewear
  • 33
  • 2
  • 10