jQuery AJAX Character Encoding Problem

Question

Hi everyone,

I'm currently coding a French website. There's a schedule page, where a link on the side can be used to load another day's schedule.

http://aquate.us/film/horaire.html

(At the moment, only the links for November 13th and November 14th work)

Here's the JS I'm using to do this:

 <script type="text/javascript">
 function load(y) {
  $.get(y,function(d) {
   $("#replace").html(d);
   mod();
  });
 }
 function mod() {
  $("#dates a").click(function() {
   y = $(this).attr("href");
   load(y);
   return false;
  });
 }
 mod();
 </script>

The actual AJAX works like a charm. My problem lies with the response to the request.

Because it is a French website, there are many accented letters. I'm using the ISO-8859-15 charset for that very reason. However, in the response to my AJAX request, the accents are becoming ?'s because the character encoding seems to be changed back to UTF-8.

How do I avoid this? I've already tried adding some PHP at the top of the requested documents to set the character set:

<?php header('Content-Type: text/html; charset=ISO-8859-15'); ?>

But that doesn't seem to work either. Any thoughts?

Also, while any of you are looking here...why does the rightmost column seem to become smaller when a new page is loaded, causing the table to distort and each <li> within the <td> to wrap to the next line?

Cheers

Answer 1

UTF-8 is supposed to handle all accents and foreign chars - why not use it on your data source?

EDIT
Here's a test file with your data

Everything should be UTF-8 in the first place. I loaded the files in notepad++, converted to utf-8 and manually changed the charactes to accents were needed. Once done everything's working like a charm.

BTW, unless your server is defined to php-process .html files, the files you're loading with ajax aren't getting your iso charset. If you insist on using the iso charset, request a php file instead of an html file, and define the charset in the header (not in the file itself)

Answer 2

You need to set up your server to use ISO-8859-15 as the character encoding (adding the appropriate HTTP header). Doing it in the body of the html won't help.

I can see this line

<?php header('Content-Type: text/html; charset=ISO-8859-15'); ?>

at the source of your html. This shouldn't happen. Using Live HTTP Headers I can't see the appropriate charset HTTP header. Use that for both your first page and the ajax service.

Answer 3

When printing out the variables in the ajax file. Put a

htmlentities()

Around them, see if it works. Worked for me in an Icelandic ajax application.

Answer 4

Specifying the content type on the AJAX-call solved my problems on a Norwegian site.

$.ajax({
        data: parameters,
        type: "POST",
        url: ajax_url,
        timeout: 20000,
        contentType: "application/x-www-form-urlencoded;charset=ISO-8859-15",
        dataType: 'json',
        success: callback
});

You would also have to specify the charset on the server.

<?php header('Content-Type: text/html; charset=ISO-8859-15'); ?>

Answer 5

I´ve had the same problem with pages that:

• Show up fine when called normally
• Have the special characters messed up when called via an ajax request

To solve the problem (using php), I used utf8_encode() or htmlentities() on the source data. Both worked, I have used them in different projects.

Answer 6

But what if you can't change what the server sends? I have exactly the same problem trying to get a HTML page that is ISO-8859-1 encoded and do some parsing with it. But I have no way to change the backend. Is there any hope?

Answer 7

I DONT AGREE everything must be UTF-8, you can make it work perfectly with ISO 8859, I did, please read my response here.

my response in stackoverflow

Answer 8

Use contentType: "application/x-www-form-urlencoded;charset=utf-8",

Answer 9

$str=iconv("windows-1250","UTF-8",$str);

what helped me on the eventualy

Answer 10

You can use windows-1252, UTF-8 didn't work for me either

link text

Answer 11

I would strongl suggest the use of the javascript escape() method

you can use this with jQuery by grabbing a form value like so:

var encodedString = escape($("#myFormFieldID").val());

Answer 12

Doug:

Thank you. That worked perfectly like a bear with berry!

Answer 13

"var encodedString = escape($("#myFormFieldID").val());"

Work nice (utf-8) with %20 and polish characters other than "ó", ó - returns xFFFD. try "zażółcić" -> zaż�łcić.

Other ideas ?

Answer 14

Hi People I was having similar problems, working in a content comments system in our Spanish Portal. What finally solved my problem, after many hours of searching, instead of messing with jQuery charset, that seems to use utf-8 no matter what, it was to decode from utf-8 back to ISO-8859-1 in the PHP that processed the ajax POST. In PHP there is a built in function, utf8_decode(), so the first thing I do with the comments string is this: $comentario = utf8_decode($_POST['comentario']);

(and then I used nl2br() and htmlentities() PHP functions in order to prepare the text to be stored with html entities instead of special chars)

Good Luck & Peace all over! Seba

Answer 15

I have been fiddling around with this problem and found out that this solution works for Firefox and safari (yes, im on a mac at the moment).

when getting the request, i made a content-type=iso-8859-1 here:

if (window.XMLHttpRequest) { // Mozilla, Safari, ...
  httpRequest = new XMLHttpRequest();
        if (httpRequest.overrideMimeType) {
            httpRequest.overrideMimeType('text/xml; charset=ISO-8859-1');
        }
    }

Please tell me if someone finds out this doesn't work in ie.