Ver Mensaje Individual
  #1 (permalink)  
Antiguo 30/09/2014, 06:51
emeotero
 
Fecha de Ingreso: mayo-2011
Ubicación: Santiago de Compostela
Mensajes: 126
Antigüedad: 13 años, 10 meses
Puntos: 0
Autocomplementar con ajax, php, Error

Hola,
estoy intentando implementar en un formulario un sistema de autocomplementado, pero no encuentro la manera, (falta de experiencia, conocimientos etc)...
El error puede encontrarse en el script de Ajax. La metodología es que selecciono un elemento, envio el dato y ejecuta una consulta en php que me devolverá un JSON.
Primeramente hago la query para llenar el formulario:
Código PHP:
$query1 'SELECT distinct code, objeto FROM objectos ORDER BY code';
                
$result1 pg_query($query1) or die('Query failed: ' pg_last_error());
                                                
$arreglo_php = array();
    if(
pg_num_rows($result1)==0)
        
array_push($arreglo_php"NO Datos");
    else{
        while (
$elemento pg_fetch_array($result1)) {
                
array_push($arreglo_php$elemento["code"]);
        }
    } 
Pongo el script de autocompletar
Código:
<script>
  $(function(){
    var autocompletar = new Array();
    <?php //Esto es un poco de php para obtener lo que necesitamos
     for($p = 0;$p < count($arreglo_php); $p++){ //usamos count para saber cuantos elementos hay ?>
       autocompletar.push('<?php echo $arreglo_php[$p]; ?>');
     <?php } ?>
     $("#elemento").autocomplete({ //Usamos el ID de la caja de texto donde lo queremos
       source: autocompletar //Le decimos que nuestra fuente es el arreglo
     });
  });
</script>
Ahora pongo el formulario
Código HTML:
<form class="recursos2" id="OBJ" name="OBJ" method="post" action="#"  onsubmit="return false;">
<input type="text" id="elemento" name="elemento">
<input name="ejecutar1" type="submit" id="btsubmit1" value="OK" onClick="objeto();/> 
</form> 
La función objeto la meto en el script de AJAX y una vez pasa los datos ejecuta la pagina objetos.php que escribe el JSON
Código:
function objeto(){
	var elemento = document.getElementById("OBJ");
	obje = document.getElementById('elemento');
	var txt='';
	var i;
	var count = 0;
	for (i=0; i<obje.options.lenght; i++) {
	    if (obje.options[i].selected) {
	      if (count==0)
		  	txt+= "'"+obje.options[i].value+"'";
		  else
			 txt+= "#'"+obje.options[i].value+"'";
	    }
	count++;
	}
		url_obje ='elementos='+txt;
		xhr(url_obje);
}


var xmlhttp; 
function xhr(OBJ){ 
		if (window.XMLHttpRequest)
  			{// code for IE7+, Firefox, Chrome, Opera, Safari
  				xmlhttp=new XMLHttpRequest();
	  		}
		else
	  		{// code for IE6, IE5
  				xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  		}
		xmlhttp.onreadystatechange = RespuestaModel;
		xmlhttp.open("POST", "objetos.php", true);
		xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		//xmlhttp.setRequestHeader("Content-length", 2);
		//xmlhttp.setRequestHeader("Connection", "close");
		xmlhttp.send(OBJ);
}

function RespuestaModel(){
		if(xmlhttp.readyState == 4) {
      		if(xmlhttp.status == 200) {
				storeOB.load();
				checktrue1();
			}
    	}
}
Para empezar me devuelve el error

Código HTML:
Uncaught TypeError: Cannot read property 'lenght' of undefined
Probé a poner en lugar de obje.options poner obje.select, pero en este momento la cadena va vacia, no pasa ningún parametro para que lo recoja la página php donde escribo el JSON.
En la página lo recojo del modo
Código PHP:
$conexion "host=$db_host port=$db_port dbname=$db_name user=$db_user password=$db_pass";
$dbconn pg_connect($conexion);

if (!
$dbconn){
    echo 
"<center>La conexi&oacute;n con la base de datos no se ha realizado.</center>";
    exit;
}

$procesar $_POST['elemento'];
$query "SELECT code, objeto, ST_AsGeoJSON(the_geom, 4) AS geojson FROM objectos where code in (".ltrim($procesar,',').") ORDER BY code";
$result pg_query($query) or die('Query failed: ' pg_last_error());
//
$geojson = array(
    
'type' => 'FeatureCollection',
    
'features' => array()
);
$i 0;
while (
$line pg_fetch_assoc($result)) {
    
$feature = array(
    
'geometry' => json_decode($line['geojson'], true),
    
'properties' => $data[]=$line,
    
'id' => $i++
    );
    
array_push($geojson['features'], $feature);
}
$loca json_encode($geojson);

$conta "datos/objeto" .session_id(). ".json";

//$conta = "data/localiza.json";

$archivo fopen($conta"w");

fwrite($archivo$loca);
fclose($archivo); 
Este método lo uso con un formulario normal con selects
Código HTML:
<?php
$query1 = 'SELECT distinct code, objeto FROM vw_objects ORDER BY code';
				
$result1 = pg_query($query1) or die('Query failed: ' . pg_last_error());
?>
<form class="recursos2" id="OBJ" name="OBJ" method="post" action="#" style="display:none;" onsubmit="return false;"> 
<select name="elemento2" id="elemento"> 
<option value="">-- Descrip. a buscar --</option>
<?php while ($line = pg_fetch_array($result1, null, PGSQL_ASSOC)) {
	echo "<option value=". $line["code"].">". $line["code"]."</option>";
	} ?>
</select>
<input name="ejecutar2" type="submit" id="btsubmit2" value="OK" onClick="objeto()"/> 
</form> 
y me funciona sin problema, pero es que quiero ir más allá porque no es del todo operativo tener que buscar en una lista seleccionando sin la opción de autocomplementado.
Alguno de vosotros podría echarme una mano con esto. Agradeciéndolo de antemano. Un Saludo.