[jQuery] Różne kodowanie strony i wyniku Ajax

W jednym z wcześniejszych wpisów opisałem, w jaki sposób naprawić problem z różnymi kodowaniami znaków na stronie wykorzystującej Ajax oraz zasób, do którego się odwołujemy na serwerze.

W tym artykule pokażę, jak to zrobić wykorzystując jQuery.

Na początek

jQuery posiada przyjazny interfejs wykorzystywania mechanizmów ajaksowych na naszych stronach. W problemie, który sobie stawiam w linkowanym we wstępie artykule skorzystam z możliwości ustawiania kodowania znaków w odpowiedzi otrzymywanej z serwera. Opisywany sposób nie działa w IE.

Opcja `beforeSend’ $.ajax

$.ajax udostępnia opcję `beforeSend‚, dzięki której można dla konkretnego żądania ustawić odpowiednie spodziewane kodowanie:

<html>
<head>
    <title>jQuery z ustawianiem charset</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
    <script type="text/javascript">
    $(function() {
        $.ajax({
            url: 'iso-8859-2.php',
            beforeSend : function(xhr)
            {
                xhr.overrideMimeType('text/html; charset=iso-8859-2');
            },
            success: function(data)
            {
                $('#result').html(data);
            }
        });
    });
    </script>
</head>
<body>
    <div id="result" />
</body>
</html>

Plik ‚iso8859-2.php’ posiada krótki kod:

[php]<?php
// odkomentowanie poniższej linii rozwiązuje problem – także w IE
//header(‚Content-Type: text/html; charset=iso-8859-2’);
echo "Witaj świecie!";[/php]

Istnieje także drugie rozwiązanie – wykorzystanie ustawień globalnych dla żądań ajaksowych z wykorzystaniem jQuery.

beforesend w $.ajaxSetup

Wykorzystując opcję `beforeSend’ dla metody `$.ajaxSetup‚ możemy ustawić kodowanie dla wszystkich żądań ajaksowych wykonywanych za pomocą frameworka jQuery.

<html>
<head>
    <title>jQuery z ustawianiem charset</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
    <script type="text/javascript">
    $(function() {
        $.ajaxSetup({
            beforeSend : function(xhr)
            {
                xhr.overrideMimeType('text/html; charset=iso-8859-2');
            }
        });
        $.ajax({
            url: 'iso-8859-2.php',
            success: function(data)
            {
                $('#result').html(data);
            }
       });
    });
    </script>
</head>
<body>
    <div id="result" />
</body>
</html>

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *