jQuery AJAX Character Encoding

Question

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.

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

Solution 1

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

EDIT
[Archive copy of the 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)

Solution 2

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'); ?>

Solution 3

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

what helped me on the eventually

Solution 4

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.

Solution 5

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());

View more solutions