+2

Palavras acentuadas com ajax

criado por Fabrício Nogueira Magri em 25/01/2006 6:49am
Agora o exemplo completo:
pagina ajax.php
<script language="JavaScript"> 
<!-- 

var xmlhttp; 

function ajax() { 

   if (window.XMLHttpRequest) { 
      xmlhttp = new XMLHttpRequest(); 
   } else if (window.ActiveXObject) { 
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
   } else { 
       alert("Seu navegador n&atilde;o suporta XMLHttpRequest."); 
      return; 
   } 

    xmlhttp.open("GET", "teste.php?texto=" + url_encode("teste... éé"), true); 
    xmlhttp.onreadystatechange = processReqChange; 
    xmlhttp.send(null); 
} 

function processReqChange() { 
    if (xmlhttp.readyState == 4) { 
       if (xmlhttp.status == 200) { 
           document.getElementById("texto").innerHTML = url_decode(xmlhttp.responseText); 
      } else { 
          alert("Problemas ao carregar o arquivo."); 
      } 
    } 
} 


// url_encode version 1.0 
function url_encode(str) { 
    var hex_chars = "0123456789ABCDEF"; 
    var noEncode = /^([a-zA-Z0-9\_\-\.])$/; 
    var n, strCode, hex1, hex2, strEncode = ""; 

    for(n = 0; n < str.length; n++) { 
        if (noEncode.test(str.charAt(n))) { 
            strEncode += str.charAt(n); 
        } else { 
            strCode = str.charCodeAt(n); 
            hex1 = hex_chars.charAt(Math.floor(strCode / 16)); 
            hex2 = hex_chars.charAt(strCode % 16); 
            strEncode += "%" + (hex1 + hex2); 
        } 
    } 
    return strEncode; 
} 

// url_decode version 1.0 
function url_decode(str) { 
    var n, strCode, strDecode = ""; 

    for (n = 0; n < str.length; n++) { 
        if (str.charAt(n) == "%") { 
            strCode = str.charAt(n + 1) + str.charAt(n + 2); 
            strDecode += String.fromCharCode(parseInt(strCode, 16)); 
            n += 2; 
        } else { 
            strDecode += str.charAt(n); 
        } 
    } 
    return strDecode; 
} 
//--> 
</script> 
<a href="javascript:ajax()">Testar</a> 
<div id="texto"></div>
E a página teste.php que estou chamando pelo ajax. 
<?php 
$texto = rawurldecode($_GET["texto"]); 
echo "O texto '$texto' não teve problemas na acentuação."; 
?>

Como vocês viram, não tem segredo. É só adicionar as duas funções no seu codigo javascript, e usar a url_encode para tudo que for enviar, e usar a url_decode para tudo que receber.
E no php usar rawurldecode para tudo que receber e rawurlencode para tudo que imprimir na tela de texto.

Espero que tenham gostado desse tutorial.

Falou...
Fabrício Nogueira Magri

Comentários:

Mostrando 1 - 10 de 31 comentários
Eduardo Nunes disse:
eu encontrei a solução para esse problema simplesmente utilizando a funcao utf8_encode() antes de exibir o resultado.


EX:

<option value="*"><? echo ucfirst(utf8_encode($string)) ?></option>


É isso ae, espero ter ajudado

Abraços a todos
21/10/2006 4:43am (~14 anos atrás)

E aí Júlio...

Bom, essa minha solução realmente está ultrapassada. Eu criei isso logo no início da era ajax.

Existem comandos específicos do javascript para fazer isso como "escape" e "unescape".

Bom, mas essa sua solução vai ter problemas em alguns casos, como os dados serem enviados em outro formato diferente do ISO-8859-1, já que isso pode ser definido pelo navegador. Então usuários de outros países, ou até mesmo navegadores diferentes podem dar erro.

Recomendo vc a começar a usar comandos como eu mencionei logo acima.

Falou,
Fabrício
12/10/2006 9:35am (~14 anos atrás)

Apenas coloque no começo da página da onde que vem os dados

header("Content-Type: text/html; charset=ISO-8859-1",true);

Eu conselho por isso em todas as páginas não só as usadas para o ajax assim você não corre perigo de alguma coisa "estragar" os seus textos em português (Acentuados)... ;)
11/10/2006 10:21pm (~14 anos atrás)

Funcionou no IE versao 6 com SP2 e no linux no mozzila versão 1.4. Ja no conqueror não teve acordo, não conseguiu instanciar o objeto XMLHttpRequest.
11/06/2006 3:14pm (~14 anos atrás)

1) no js, o link de chamada para o form :
saveTopic: function() {
formulario = document.cadastra.elements;
param = ajax.camposForm(formulario);
// alert(param);

xmlhttp.open('POST', 'avaliacaoGrava.php', true);
xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xmlhttp.onreadystatechange = ajax.respostasCadastro;
var param = unescape(param.replace(/\+/g," "));
xmlhttp.send(param);
},

no php, tratamento pra gravar na base de dados:

$fName = utf8_decode (trim($_POST['nome']));
$fTitle = utf8_decode (trim($_POST['titulo']));
$fEmail = utf8_decode ($_POST['email']);
$fText = utf8_decode (trim($_POST['texto']));

feito isso foi so gravar na base de dados e tudo funcionou perfeito.
11/06/2006 3:11pm (~14 anos atrás)

Cara isso caiu do seu, execelente msm valew cara!
07/05/2006 8:45pm (~14 anos atrás)

Percebi que cada um tem uma solução para isso.
Bom la vai a minha simples pratica e funcional.

aonde for gerar o xml coloca <?= urlencode($variavel);?>

no javascript q vai retornar por exempro

lista = document.getElementById('layer_resultado');
lista.innerHTML=unescape(conteudo).replace(/\+/g,' ')

basta dar replace e pronto acentuacao tudo ok ;)

uso essa solucao e nao tenho problemas
outra dica
para espaços como &nbsp;
no xml vc preciza por assim: %26nbsp;

;))) vlw fuiz
28/03/2006 6:15am (~14 anos atrás)

Felipe Hlibco disse:
Pessoal, resolvi este problema de uma forma muitooo simples. Na página que contém o formulário de envio de dados usei o seguinte cabeçalho:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt">

<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>

Desta forma estamos identificando a codificação dos dados da página corrente para UTF-8, e não o ISO (que é muito comum ser tomado como padrão).
Logo, quando vc escrever algo no formulário e enviar para o banco de dados, ele já vai codificado pra UTF-8, e na volta, sua página irá retornar certinho, pq com essa META TAG, ela irá interpretar o conjunto de símbolos.

Resumindo, não precisa criar função em JS pra interpretar o texto. Bom, certifique-se de colocar esse Header acima, tanto nas páginas q contém os formulários, como nas páginas que serão Lidos os dados. Assim vc irá Escrever em UTF-8 e depois Ler em UTF-8.

Desculpe-me escrever meio rápido, mas é o sono. Qq dúvida escrevam-me.
[]s
Felipe Hlibco
26/03/2006 10:37pm (~14 anos atrás)

Quebrou um galhão... Funcionou perfeitamente... E olha que tava dando muito pau..
Valeu!
25/03/2006 10:41am (~14 anos atrás)

André Taiar disse:
Funciona perfeitamente comigo se eu colocar um HTMLEntities nas saídas, antes de passar pelo Java...

Fica uma beleeeeeza! =)
22/03/2006 4:44pm (~14 anos atrás)

Novo Comentário:

(Você pode usar tags como <b>, <i> ou <code>. URLs serão convertidas para links automaticamente.)