Foros del Web » Programando para Internet » Jquery »

Caracteres HTML y Jquery UI Autocomplete

Estas en el tema de Caracteres HTML y Jquery UI Autocomplete en el foro de Jquery en Foros del Web. Hola a todos, Despues de haber buscado y leído una cantidad inmensa de foros no logro solucionar mi problema. Resulta que he implementado jquery ui ...
  #1 (permalink)  
Antiguo 09/03/2012, 05:45
 
Fecha de Ingreso: agosto-2011
Ubicación: Barcelona
Mensajes: 15
Antigüedad: 12 años, 7 meses
Puntos: 3
Pregunta Caracteres HTML y Jquery UI Autocomplete

Hola a todos,

Despues de haber buscado y leído una cantidad inmensa de foros no logro solucionar mi problema. Resulta que he implementado jquery ui autocomplete para cargar una lista atacando a una bd en mysql. La llamada funciona de forma correcta pero a la hora de mostrar el listado, los acentos aparecen codificados en hmtl(acción) y no se decodifican.

Os explíco mi codigo y las distintas pruebas que he hecho:
Carga de jquery ui autocomplete para un input:
Opción a:
Código:
$('#class_search').autocomplete({
	minLength: 2,
    source: function( request, response ) {
        $.getJSON( "class_list.php", {
            term: request.term
        }, response );
    },
    select : function(event, ui) {			
    	window.open("therapeutics.php?id="+ui.item.id,'_self',false);
   }
});
Opción b:
Código:
$('#class_search'').autocomplete({
	source : "class_list.php",
	html: true,
	select : function(event, ui) {					
		window.open("lab.php?id="+ui.item.id,'_self',false);
	}
});
Ambas opciones funcionan de forma correcta.

Ahora viene la creación del array que recibe jQuery para generar la lista
Código:
	/* Conexión a la db * /
	$search = $_GET["term"];
	$datos = array();
	$brand_qry = "SELECT * FROM clases 
				  WHERE clase LIKE '%$search%' ";

	$resultado_brand_qry = mysql_query($brand_qry);								

	while ($row = mysql_fetch_array($resultado_brand_qry, MYSQL_ASSOC)){		
		$datos[] = array("id" => $row["id"], "value" => $row["clase"]);
	}
	print json_encode($datos);
Ahora en este archivo he probado:
-> Poner una cabecera para especificar el tipo de archivo
Código:
header("Content-Type: application/json");
-> Codificar la columna que se enseñara en el listado:
Código:
$row["id"], "value" => utf8_encode($row["clase"])
De ninguna manera consigo obtener la decodificación de los valores de la bd en el listado...

Os agradezco de antemano vuestra respuesta.

Última edición por daweb; 12/03/2012 a las 03:47
  #2 (permalink)  
Antiguo 12/03/2012, 18:30
Avatar de mandingaweb  
Fecha de Ingreso: febrero-2011
Ubicación: Posadas, Misiones, Argentina
Mensajes: 4
Antigüedad: 13 años, 1 mes
Puntos: 0
Respuesta: Caracteres HTML y Jquery UI Autocomplete

Hola daweb: llegue a tu post buscando solución para exactamente el mismo problema. En mi caso estoy trabajando toda la cadena (base de datos, encoding de los html, etc) en UTF8, pero al desplegar el autocomplete en el formulario aparece el nefasto ñ y sus secuaces.

Probé con la solución que proponen en el sitio de JQuery UI ([URL="http://jqueryui.com/demos/autocomplete/#folding"]http://jqueryui.com/demos/autocomplete/#folding[/URL]) y no me funciona con el script PHP que genera los datos remotos.

Si pruebo mi PHP de búsqueda veo que genera los datos correctamente (con acentos, eñes, etc), asi que creo que el problema está en la codificación JSON que hago al final, de todos modos aún no pude dar con la solución.

Has podido hallar una solución? Si yo la encuentro te la comparto.
Saludos!
  #3 (permalink)  
Antiguo 12/03/2012, 18:44
Avatar de djaevi  
Fecha de Ingreso: marzo-2007
Ubicación: Moreno, Buenos Aires
Mensajes: 400
Antigüedad: 17 años
Puntos: 47
Respuesta: Caracteres HTML y Jquery UI Autocomplete

han probado escribir los acentos normalmente en sus textos y aplicarles luego la funcion utf8_encode?, yo no uso jquery para traer datos de ajax pero supongo que sera similar, en mi base de datos tengo los textos subidos con acentos lo que hago es aplicarle la funcion que digo utf8_encode($registro); y recibo los datos lo mas bien, es una sugerencia que pueden probar je

Saludos
  #4 (permalink)  
Antiguo 12/03/2012, 18:52
Avatar de mandingaweb  
Fecha de Ingreso: febrero-2011
Ubicación: Posadas, Misiones, Argentina
Mensajes: 4
Antigüedad: 13 años, 1 mes
Puntos: 0
Respuesta: Caracteres HTML y Jquery UI Autocomplete

Gracias djaevi, ya probé la función UTF8_encode (y también decode, por las dudas), pero no funcionó.
  #5 (permalink)  
Antiguo 12/03/2012, 19:10
Avatar de mandingaweb  
Fecha de Ingreso: febrero-2011
Ubicación: Posadas, Misiones, Argentina
Mensajes: 4
Antigüedad: 13 años, 1 mes
Puntos: 0
Respuesta: Caracteres HTML y Jquery UI Autocomplete

Encontré una solución entre los comentarios del manual de PHP para la función json_encode. El código ha quedado asi, en mi caso (copio solamente el código del script PHP donde hago la consulta a la BD y genero la respuesta JSON para el autocomplete):

Código PHP:
$resultados = array();

//la consulta a la BD
$sql "SELECT nombre
    FROM def_calles
    WHERE nombre LIKE '%" 
$_GET[term] . "%'";

$qry mysql_query($sql);

while(
$res mysql_fetch_object($qry)){
    
$nom $res->nombre;

    
$resultados[] = array(  
           
'label' => $nom,  
        
'value' => $nom
    
);
}

//acá está lo que encontré en el foro de PHP
$resultados json_encode($resultados);
$resultados str_replace("\/","/",$resultados);
$resultados str_replace('"','\\"',$resultados);
$resultados json_decode('"'.$resultados.'"');
print_r($resultados);//salen perfectas las opciones del autocomplete en el formulario, con eñes y acentos! 
Todo el crédito corresponde a julien dot dev at gmail dot com que publicó esto en el manual de PHP, en [URL="http://php.net/manual/es/function.json-encode.php"]http://php.net/manual/es/function.json-encode.php[/URL].
  #6 (permalink)  
Antiguo 13/03/2012, 01:49
 
Fecha de Ingreso: agosto-2011
Ubicación: Barcelona
Mensajes: 15
Antigüedad: 12 años, 7 meses
Puntos: 3
Pregunta Respuesta: Caracteres HTML y Jquery UI Autocomplete

Buenos días mandingaweb,

En primer lugar te agradezco tu respuesta, pero aún así sigue sin funcionar... mira esto es lo que he hecho:

Llamada al php que carga el listado en función al parámetro de búsqueda
Código:
$('#class_search').autocomplete({
	source : "class_list.php",
	minLength: 2,
	dataType: "json",
	select : function(event, ui) {					
		window.open("therapeutics.php?id="+ui.item.id,'_self',false);
	}				
});
Fichero que interactua con la base de datos, lo he modificado siguiendo tu ejemplo:
Código:
        // Conexión a la base de datos: 

	// He probado meterle este header pero tampoco...
        header( 'Content-type: text/html; charset=UTF-8' );	
	$resultados = array(); 

	//Consulta al la db
	$sql = "SELECT id, clase FROM clases 
			WHERE clase LIKE  '%" . $_GET[term] . "%' "; 

	$qry = mysql_query($sql); 

	while($res = mysql_fetch_object($qry)){ 
	    $nom   = $res->id; 
	    $clase = $res->clase;
	    $resultados[] = array(   
	    	"id"	     => $nom, 
		"value" => $clase
	    ); 
	}	
	$resultados = json_encode($resultados); 
	$resultados = str_replace("\/","/",$resultados); 
	$resultados = str_replace('"','\\"',$resultados); 
	$resultados = json_decode('"'.$resultados.'"'); 
	print_r($resultados);
Si quieres verlo en funcionamiento esta es la url que va haciendo la consulta a la bd:
[URL="http://cfg.com.do/class_list.php?term=der"]http://cfg.com.do/class_list.php?term=der[/URL]
y esta es la url que muestra el listado:
[URL="http://cfg.com.do/productos.php"]http://cfg.com.do/productos.php[/URL] -> si quieres probarlo hazlo en la caja que pone "Clase terapéutica"

Si has llegado hasta aquí te agradezco mucho tu respuesta.
  #7 (permalink)  
Antiguo 13/03/2012, 05:48
Avatar de mandingaweb  
Fecha de Ingreso: febrero-2011
Ubicación: Posadas, Misiones, Argentina
Mensajes: 4
Antigüedad: 13 años, 1 mes
Puntos: 0
Respuesta: Caracteres HTML y Jquery UI Autocomplete

Hola daweb!
Lamento que no te haya funcionado, a mi me anduvo perfecto. Te pregunto: que collation usás en la BD? yo tengo todo en UTF8-spanish. En el script PHP no le agregué ningún encabezado, te copio el código completo:

buscaCalle.php

Código PHP:
<?
require("../../php-includes/sistema/dbconnect.inc.php");
$resultados = array();
$sql "SELECT DISTINCT nombre
        FROM def_calles
        WHERE nombre LIKE '%" 
$_GET[term] . "%'";
$qry mysql_query($sql);
while(
$res mysql_fetch_object($qry)){
    
$nom $res->nombre;
    
$resultados[] = array(  
           
'label' => $nom,  
        
'value' => $nom
    
);
}
$resultados json_encode($resultados);
$resultados str_replace("\/","/",$resultados);
$resultados str_replace('"','\\"',$resultados);
$resultados json_decode('"'.$resultados.'"');
print_r($resultados);
?>
y la llamada al autocomplete:

Código:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- mas cosas no relevantes por aqui -->

<script language="javascript">
$(document).ready(function(e) {
	$("#dir_calle").autocomplete({
		source: '../PHP-includes/datos/buscaCalle.php',
		minLength: 2
	});
/* y sigue con otros autocomplete */
No se me ocurre que más puede estar distinto. Espero que algo de esto te sea de ayuda.
Saludos!
  #8 (permalink)  
Antiguo 13/03/2012, 05:54
 
Fecha de Ingreso: agosto-2011
Ubicación: Barcelona
Mensajes: 15
Antigüedad: 12 años, 7 meses
Puntos: 3
Respuesta: Caracteres HTML y Jquery UI Autocomplete

Hola mandingaweb,

Mi bd la tengo en utf8_general_ci... voy a probar el cambio y quitar el header que le puse a ver...

Muchas gracias!

Etiquetas: caracteres, funcion, html, input, js, php, autocompletado
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 10:50.