Entendido.

Este sitio utiliza cookies para analizar la navegación. Si continúa navegando se entiende que acepta su uso. Ver más detalles.";

Aprende Web

Crea y diseña tus sitios en la Web.

Manual de Ajax

Ajax permite mandar y recibir datos de manera asincrona

Y ahora tambien aprende a programar en C++ con Aprende Web C++

Manuales para la creación y diseño de páginas web

RSS. Suscribir canal.

Este obra está bajo una licencia de Creative Commons Reconocimiento-NoComercial 4.0 Internacional.

AJAX (XIII)

Problemas con acentos

problema de codificación

Uno de los problemas más frecuentes cuando se empieza a utilizar ajax es la visualización correcta de los acentos y algunos caracteres propios de nuestro idioma (la ñ o la ü). En lugar de aparecer los caracteres normales aparecen unos signos de interrogación extraños (dentro de un rombo). Veremos en esta página cómo solucionar este problema.

Esto es debido al tipo de codificación de caracteres que utiliza ajax. Este está limitado a los de la lengua inglesa (tipo ASCII), por lo que todos los caracteres que no estén incluidos en el tipo ASCII serán escritos de forma incorrecta.

Para evitar esto debemos cambiar el tipo de codificación que usa ajax. Esto debemos indicarlo en el archivo que contiene la respuesta cuando recogemos datos.

Al enviar datos al servidor, a estos también les cambiaremos la codificación, para que se interpreten correctamente. Este cambio se realiza en el servidor mediante unos métodos creados para esto.

Veamos ahora los casos que pueden presentársenos y las soluciones para este problema.

archivos XML

En los archivos XML el problema está solucionado porque en la primera línea debemos poner el tipo de codificación para el archivo, si queremos que éste funcione con palabras con acentos:

<?xml version="1.0" encode="ISO-8859-1"?>

La línea es obligatoria para que se viisualice el archivo sin mensajes de error, en ella viene el tipo de codificación ("ISO-8859-1). Para obtener más información visita el manual de XML página Sintaxis del XML

Archivos de texto

Si lo que queremos ver mediante ajax es un archivo de texto plano, es muy posible que en lugar de signos como acentos, vocales con diéresis o letra ñ veamos un signo de interrogación raro metido dentro de un rombo.

Pongamos un ejemplo, el cual iremos corrigiendo a lo largo de la página. Lo que hagamos aquí también vale para los archivos con código HTML que contienen acentos en su texto. Tenemos el siguiente archivo de texto:

Prueba de caracteres: á, é, í, ó, ú, ü,  ñ, Á, É, Í, Ó, Ú, Ñ;

Al visualizarlo transferirlo e insertarlo en pantalla mediante ajax obtenemos lo siguiente:

todos los caracteres especiales están ocultos. Para evitar esto tenemos varias soluciones. Lo primero que se nos ocurre es cambiar los caracteres especiales por sus correspondientes entidades, de manera que cambiamos el archivo anterior por este otro:

Prueba de caracteres: á, é, í, ó,
ú, ü, ñ, Á, É, 
&Iacute, Ó, Ú, Ü Ñ

Hemos cambiado cada caracter problemático por su correspondiente entidad. Ahora el archivo anterior lo veremos de la siguiente manera al transferirlo mediante ajax:

Sin embargo este método puede ser bastante costoso, ya que debemos cambiar uno a uno todos los caracteres problemáticos, y esto aparte de llevarnos mucho tiempo y poder ser fuente de errores, es posible que no lo podamos hacer si el texto del archivo se crea automáticamente con PHP (archivos que guardan datos que recogemos del usuario).

Así que buscamos otro método para solucionar el problema: cambiar el tipo de codificación del archivo. Algunos editores de texto no permiten hacer esto, sin embargo el block de notas de windows si que puede hacerlo.

Abrimos el archivo con el block de notas de windows, y en el menú Archivo, pulsamos en "Guardar como". Nos sale un cuadro de diálogo para guardar el archivo. En la parte de abajo tenemos tres cuadrados de opciones: "Nombre", "Tipo" y "Codificación". Pulsamos en la flecha de la derecha de "Codificación" y elegimos "UTF-8". Guardamos luego el archivo con el mismo nombre y lo reemplazamos.

Probamos después a transferir el archivo a la página mediante ajax y nos aparece de la siguiente manera:

Como ves el método es bastante más fácil que el anterior. Pero si por lo que sea no queremos (o no podemos) cambiar el archivo original. aún tenemos otro método. Éste consiste en recoger el contenido del archivo de texto en un archivo PHP y desde ahí enviarlo por ajax a la página. En este caso la modificación la hacemos en la página PHP y no en el archivo.

Veamos ahora el método para solucionar el problema de los acentos en las páginas enviadas en PHP.

Archivos PHP

Los archivos PHP también tienen este problema con los acentos, sin embargo la solución es bastante sencilla. basta con poner al principio del archivo, en la primera línea, el siguiente código:

header("Content-Type: text/plain; charset=iso-8859-1");

La instrucción header debe ponerse siempre al principio del archivo. El parámetro que le pasamos indica el tipo de contenido que tiene el archivo. (Content-Type: ); indicamos el tipo de archivo, para un archivo de texto (.txt) será text/plain, pero si queremos poner otro tipo de archivos remplazaremos esto por text/html, text/css, text/javascript, etc. En segundo lugar indicamos el tipo de codificación, que para la lengua española o cualquier otra lengua de europa occidental será: charset=iso-8859-1.

Veamos por ejemplo el siguiente archivo php:

<?php  
header("Content-Type: text/plain; charset=iso-8859-1");
echo "Prueba de caracteres: á, é, í, ó, ú, ü,  ñ, Á, É, Í, Ó, Ú, Ñ;";
?>

Transferimos este archivo a la página mediante ajax y observamos el siguiente resultado:

Vemos que el resultado es correcto. Si hicieramos la prueba de quitar del archivo la primera línea observaríamos que los caracteres especiales no se verián correctamente.

Mediante PHP podemos hacer que se vean bien otros archivos de texto sin tener que modificarlos en sí mismos. para ello basta con transferir el contenido del archivo a PHP y después enviarlo por ajax. Por ejemplo tenemos el archivo de texto llamado ejemplo11_1.txt:

Recogemos su contenido en un archivo PHP, al que le hemos puesto la instrucción header :

<?php  
header("Content-Type: text/plain; charset=iso-8859-1");
$miarchivo=fopen("ejemplo11_1.txt","r");
$ver = fgets($miarchivo); //leer archivo
fclose($miarchivo); //cerrar archivo
echo $ver;
?>

Hemos recogido el texto del archivo de texto en el archivo PHP y lo sacamos como texto.

Al ser el archivo de texto de una sóla línea, en el código PHP hemos usado el método fgets de una forma sencilla. Para archivos de más de una línea deberíamos emplear otro código en PHP. (explicado en el manual de PHP).

Ahora al transferir el archivo PHP a la página por ajax obtendremos lo siguiente:

Enviar datos

Al enviar datos a un archivo PHP, bien sea mediante GET o POST, los caracteres con acentos pueden verse alterados al ser recibidos. Para evitar esto PHP dispone de un método que codifica los caracteres para que se vean correctamente. Una vez que hemos recibido los datos:

$envio=$_POST["misdatos"];

Utilizamos el método utf8_decode() para codificar los datos al alfabeto español:

$envio=utf8_decode($envio);

Veamos un ejemplo simple. enviamos unos datos con javascript. Utilizamos aquí para enviarlos el objeto ObjetoAjax y los métodos de este objeto vistos en páginas anteriores:

misdatos="misdatos=Prueba: á, é, í, ó, ú, ü,  ñ, Á, É, Í, Ó, Ú, Ñ;";
ajax6=new ObjetoAjax();
ajax6.pedirPost("ejemplo11_3.php","prueba6",misdatos);

Donde "ejemplo11_3.php es el archivo php que escribiremos a continuación, y "prueba6" es el "id" de la página donde veremos la respuesta.

El archivo PHP devuelve los mismos datos que hemos enviado, con lo que comprobamos que los datos se pueden guardar correctamente:

<?php  
header("Content-Type: text/plain; charset=iso-8859-1");
$envio=$_POST["misdatos"];
$envio=utf8_decode($envio);
echo $envio;
?>

Comprobamos el resultado del envio de datos por ajax, y vemos que se han recogido los datos correctamente en el servidor. Este es el resultado:

Con esto resolvemos uno de los principales problemas que puede presentar ajax para los desarrolladores de webs que quieran utilizarlo.

El manual de ajax está prácticamente acabado, en la próxima página, última de este manual, daremos algunos consejos para su utilización, y pondremos a disposición del usuario una versión para descargar del ObjetoAjax que hemos ido creando a lo largo de este manual.

Utilizar Ajax.

Página creada por ANYELGUTI.

Sugerencias: aprendeweb@aprende-web.net. Envia un

Visita nuestro blog par saber en qué estamos trabajando: Aprende Web Blog

Más sobre anyelguti en http://anyelguti.16mb.com