jquery/ajax set charset header

Question

Hi,

I am trying to set the charSet in a jquery call the site I am making is for a Lithuanian friend thus has some letters with accents etc.

As far as my research so far (2 days worth!!!) has shown, I need to place it in the beforeSend section which I have done as follows:

     $(document).ready(function(){
 $('.content').load('home.html');   //by default initally load text from boo.php
     $('#navlist a').click(function() { //start function when any link is clicked
                    $(".content").slideUp("slow");
                     var content_show = $(this).attr("title"); //retrieve title of link so we can compare with php file
                        $.ajax({
                        method: "load",url: ""+content_show,
                        beforeSend: function(){
                            XMLHttpRequest.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");
                            $("#loading").show("fast");
                        }, //show loading just when link is clicked
                        complete: function(){ $("#loading").hide("fast");}, //stop showing loading when the process is complete
                        success: function(html){ //so, if data is retrieved, store it in html
                        $(".content").show("slow"); //animation
                        $(".content").html(html); //show the html inside .content div
                 }
             }); //close $.ajax(
     }); //close click(
 }); //close $(

I have tried changing it to

setRequestHeader("Content-Type", "text/plain;charset=UTF-8");

Which also does not work, so now I am stuck and at the end of my nerves having looked around for two days.

The website can be viewed at 43dennis.co.nr/bivakas Basically it loads with a bunch of square black questions marks in place of the letters with special accents.

Many thanks for the help.

Answer 1

This isn't going to work due to security restrictions. You need to set the charset in the parent page from where this JS runs. The JS/jQuery will use the same charset.

I checked the HTML of your webpage and I see the following:

<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

You need to replace iso-8859-1 by UTF-8, then you don't need to hassle with it in JS/jQuery.

I checked the HTTP response headers of your webpage and I see the following:

Content-Encoding: gzip
Vary: Accept-Encoding
Date: Sun, 04 Jul 2010 13:37:08 GMT
Server: LiteSpeed
Connection: close
X-Powered-By: PHP/5.2.10
Content-Type: text/html
Content-Length: 600

200 OK

The Content-Type is missing the charset attribute. You also need to set the same in the HTTP response header. Put this in your PHP code, before you emit any character into the response body.

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