Blog webdeveloperski Patryk yarpo Jar

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

Autor wiadomości Maj 23, 2011

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
// odkomentowanie poniższej linii rozwiązuje problem - także w IE
//header('Content-Type: text/html; charset=iso-8859-2');
echo "Witaj świecie!";

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>
Komentarze (0) Trackbacks (0)

Brak komentarzy.


Leave a comment

 

Brak trackbacków.