Como enviar un array u objeto mediante xajax?

manriquez · #1 (**permalink**) 02/01/2008, 07:53

Hola comunidad.
Antes que nada, no manejo javascrip ni tampoco XML, solo PHP.
He leido el manual de xajax para php, y he entendido bastante lo que es ajax. Mi consulta va relacionada sobre como hacer un select en vez de un insert en el manual de Artículo en el que se realiza un envío de formulario con Ajax y PHP y se inserta la información en una base de datos, entonces estaba pensando que en vez de asignarle a la variable $salida un mensaje, asignarle un array u objeto o nose, para mostrar el resultado de una consulta SELECT.

Espero haber sido claro en mi pregunta.
Gracias.

pr0 · #2 (**permalink**) 02/01/2008, 10:08

Hola que tal, te propongo 2 opciones:

Usar JSON
http://necudeco.com/index.php/2007/04/05/ajax-o-ajaj/

o

Desde el php te creas un String separando por comas cada uno de los valores del array (usando explode y demas...).
Despues mediante Ajax ya no tendras problemas en tratar esa variable ya que se trata de un simple String.
Por ultimo al recibir en el PHP de nuevo ese String, vuelves a componer el array de nuevo en caso de que necesites recomponerlo o simplemente de nuevo con explode vas recogiendo cada uno de los datos de ese array.

Espero que te sirva. Saludos

manriquez · #3 (**permalink**) 02/01/2008, 10:30

Voy a tratar de hacerlo, aunque desconosca la funcion explode, pero investigaré, y gracias por responder.

pr0 · #4 (**permalink**) 02/01/2008, 10:41

Perdon quería decir IMPLODE, que para este caso es lo que debes usar.

Supongamos que tienes el array $vector que contiene 5 elementos, pues bien si pones la siguiente linea:

Código PHP:

  $vector = array('el1', 'el2', 'el3', 'el4', 'el5');
$cadena = implode(",", $vector);

eso haría que

Código PHP:

  $cadena = "el1,el2,el3,el4,el5";

Despues con EXPLODE puedes cortar cada uno de esos elementos de la siguiente manera:

Código PHP:

  $cadena = "el1,el2,el3,el4,el5";
$nuevacadena = explode(",",$cadena);

con esto consigues construir un array con cada uno de los valores que has cortado con explode de tal manera que

Código PHP:

  $nuevacadena[0] = 'el1';
$nuevacadena[1] = 'el2';
$nuevacadena[2] = 'el3';
.......

Espero que te sirva de ayuda.

manriquez · #5 (**permalink**) 03/01/2008, 07:37

gracias nuevamente, a trabajar.

manriquez · #6 (**permalink**) 04/01/2008, 06:28

Gracias por responder, pero no logro solucionar mi problema, o sea, la funcion Implode y Explode de php son bastantes utiles, pero ¿que pasa si lo que quiero enviar se trata de una matriz, es decir, un array multidimensional?

Mejor les voy a colocar el codigo , puede que a lo mejor me presenten nuevas soluciones.

Código PHP:

  <? 
require ('../xajax/xajax.inc.php'); 
$xajax = new xajax(); 
function rescatarDatos($entrada){ 
    $conn = pg_connect ("host = localhost user=postgres port=5432 password = 1234"); 
    $sql = pg_exec ($conn,"select * from proveedor"); 
    //$filas = pg_NumRows($sql);         
    /*for ($i=0;$i<$filas;$i++) 
        for ($j=0;$j<4;$j++)*/ 
           $salida= pg_fetch_row($sql,0); 
           $cadena = implode(";",$salida); 
    $respuesta = new xajaxResponse();         
    $respuesta->addAssign("mensaje","innerHTML",$cadena);//perfectamente puedo enviar el string separados por ";" de cada valor de $salida 
    return $respuesta; 
    } 
     
    $xajax->registerFunction("rescatarDatos"); 
    $xajax->processRequests(); 
 
?> 
 
<head> 
<? 
$xajax->printJavascript("../xajax"); 
?> 
</head> 
<body> 
<form id="entrada"> 
  <input type="button" value = "Presione" onClick="xajax_rescatarDatos(xajax.getFormValues('entrada'))"> 
</form> 
<?  
$cadena2 = explode(";",$cadena); // no me sirve de nada, ya que el resultado es arrojado a la capa "mensaje" y no me deja Reconstruir el arrray 
?> 
 <div id="mensaje"> 
 </div>

Pienso que me estoy ahogando en un vaso con agua, pero lo que quiero es lo siguiente: Cuando presiono un boton, por ejemplo para buscar proveedores con sus respectivos codigo, quiero que se me visualizen al lado del formulario sin tener que recargar la pagina completa, por lo que es recomendable usar AJAX, y que a su vez al presionar en X codigo , llenar un textbox con dicho dato , o sea el codigo anteriormente presionado.

Dejenme decirles que nunca he trabajado con ajax y hasta ahora solo aprendi la clase XAJAX pero solo con los ejemplos de la pagina. Otro dato importante, anterior a ésto he realizado aplicaciones con php, postgres pero solo usando iframe, sesiones.

Espero que me puedan ayudar.

PD: tengo instalado el Dreamweaver cs3 que viene con el framework spry ¿algunos ejemplos que puedan servir a lo que necesito?

Muchas gracias, esperando propuestas y soluciones.

manriquez · #7 (**permalink**) 07/01/2008, 12:58

Parece que no hay propuestas.
Como les comentaba anteriormente, estoy trabajando con iframe lo que me permite recargar solo un segmento de una pagina, pero quiero evitar el uso de iframe, y por eso quiero saber como puedo cargar una pagina en una capa.

Por ejemplo cuando envio un formulario ya sea por GET o POST el metodo ACTION me pide un vinculo para procesar los datos que a su vez me arroja errores o no. Entonces lo que necesito por lo menos es poder enviar ese formulario a una capa, que actualmente en ves de esa capa tengo un iframe y en ese iframe llame al metodo ACTION con destino al iframe.

Ayuda con alguna sugerencia...

pr0 · #8 (**permalink**) 07/01/2008, 15:01

Hola Manriquez, eso que pides es muy facil de hacer con el objeto ajax.updater de la libreria prototype:

Prototype

Para usar el objeto updater un ejemplo sencillo:

Código HTML:

function envia_datos(){
   var capa = $('id_capa'); //esto es equivalente a document.getElementById('id_capa')
   var variable1 = $('campo1').value;
   var variable2 = $('campo2').value;
   var pars = 'variable1=' + variable1 + 'variable2=' + variable2;
   if (!capa) return false;
	new Ajax.Updater(capa, 'procesa_datos.php'{
		method: 'get',
		parameters: pars
	});
}

Desde el formulario logicamente en el boton de Enviar debes llamar a la funcion envia_datos(). Una vez llama a la funcion, Ajax se encarga de llamar a la pagina procesa_datos.php y cuando obtenga el resultado lo introduce en la capa que le hayas indicado.

Saludos y espero ke te sirva.

manriquez · #9 (**permalink**) 08/01/2008, 12:09

Gracias por la ayuda amigo pr0, pero no me funciona la funcion que me mandaste, te dejo mi codigo con un simple formulario.

Código PHP:

  <script type="text/JavaScript" src="prototype.js">  
function envia_datos(){ 
   var capa = $('micapa'); //esto es equivalente a document.getElementById('id_capa') 
   var nombre = $('nombre').value; 
   var apellido = $('apellido').value; 
   var pars = 'variable1=' + variable1 + 'variable2=' + variable2; 
   if (!capa) return false; 
    new Ajax.Updater(capa, 'procesa_datos.php'{ 
        method: 'get', 
        parameters: pars 
    }); 
}  
</script> 
 
<!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" /> 
<title>Documento sin t&iacute;tulo</title> 
</head> 
 
<body> 
<form action="procesa_datos.php" method="get"> 
<table width="60%" border="0" cellspacing="0" cellpadding="0"> 
  <tr> 
    <td>Nombre</td> 
    <td><label> 
      <input type="text" name="apellido" id="apellido" /> 
    </label></td> 
  </tr> 
  <tr> 
    <td>Apellido</td> 
    <td><label> 
      <input type="text" name="textfield2" id="textfield2" /> 
    </label></td> 
  </tr> 
  <tr> 
    <td><label> 
      <input type="submit" name="button" id="button" value="Enviar" onclick="envia_datos()" /> 
    </label></td> 
    <td>&nbsp;</td> 
  </tr> 
</table> 
</form> 
<div id="micapa"></div> 
</body> 
</html>

Me podrias corregir por favor.?

pr0 · #10 (**permalink**) 08/01/2008, 18:11

Primeramente en la funcion ajax pasas mal las variables:
var capa = $('micapa');
var nombre = $('nombre').value;
var apellido = $('apellido').value;
var pars = 'variable1=' + variable1 + 'variable2=' + variable2;

deberia ser:
var capa = $('micapa');
var nombre = $('nombre').value;
var apellido = $('apellido').value;
var pars = 'variable1=' + nombre + 'variable2=' + apellido;

En el formulario tienes puesto que el boton de Enviar sea tipo submit y en el action del formulario pones envia_datos.php. Lo correcto seria que quites el submit del formulario y el boton de Enviar sea tipo button tal como:

Código HTML:

<input type="button" id="enviar" name="enviar" value="Enviar datos" onclick="envia_datos()">

Recuerda

La pagina php donde vayas a procesar las variables tendras que cogerlas como $_GET[variable1] y $_GET[variable2] y una vez proceses dichas variables tendras que imprimir el resultado con:

Código PHP:

  echo "Tus datos son:";
echo "bla bla bla";

lo ke imprimas con ECHO será lo ke se imprimirá en la capa que has indicado en la funcion Ajax.

Espero ke te sirva saludos.

manriquez · #11 (**permalink**) 09/01/2008, 07:26

Disculpa amigo, pero la verdad hice las modificaciones que mencionaste pero no me resulta, te voy a dejar el codigo para que lo revises por favor.

Código PHP:

  <script type="text/JavaScript" src="prototype.js">  
function envia_datos(){ 
   var capa = $('micapa'); //esto es equivalente a document.getElementById('id_capa') 
   var nombre = $('nombre').value; 
   var apellido = $('apellido').value; 
   var pars = 'Nombre=' + nombre + 'Apellido=' + apellido; 
   if (!capa) return false; 
    new Ajax.Updater(capa, 'procesa_datos2.php'{ 
        method: 'get', 
        parameters: pars 
    }); 
}  
</script>

Le hice las modificaciones que me dijiste.

Código HTML:

<form>
<table width="60%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>Nombre</td>
    <td><label>
      <input type="text" name="nombre" id="nombre" />
    </label></td>
  </tr>
  <tr>
    <td>Apellido</td>
    <td><label>
      <input type="text" name="apellido" id="apellido" />
    </label></td>
  </tr>
  <tr>
    <td><label>
      <input type="button" name="button" id="button" value="Enviar" onclick="envia_datos()" />
    </label></td>
    <td>&nbsp;</td>
  </tr>
</table>
</form>

Y me dijiste que le cambiara le cambiara el tipo al boton al tipo button, pero aun asi no me resulta.

La funcion prototype esta en el mismo directorio y la descargue de la pagina que me diste y la guarde como prototype.js.

No entendi bien lo del formulario, le quite las propiedades de method, action pero aun asi no resulta, y antes que las quitara tampoco funcionaba.

Te ruego me ayudes, gracias.

pr0 · #12 (**permalink**) 09/01/2008, 12:16

podrias ponerme el codigo de tu pagina PHP?

es mas ke posible ke el problema esté ahi.

Por cierto en la linea:

Código PHP:

  var pars = 'Nombre=' + nombre + 'Apellido=' + apellido;

tienes un fallo y es que tienes que poner delante de Apellido un & ya que es el segundo parametro que pasas por URL.

Código PHP:

  var pars = 'Nombre=' + nombre + '&Apellido=' + apellido;

Saludos

manriquez · #13 (**permalink**) 09/01/2008, 12:55

procesa_datos.php

Código PHP:

  <script type="text/JavaScript" src="prototype.js">  
function envia_datos(){ 
   var capa = $('micapa'); //esto es equivalente a document.getElementById('id_capa') 
   var nombre = $('nombre').value; 
   var apellido = $('apellido').value; 
   var pars = 'nombre=' + nombre + '&Apellido=' + apellido; 
   if (!capa) return false; 
    new Ajax.Updater(capa, 'procesa_datos2.php'{ 
        method: 'get', 
        parameters: pars 
    }); 
}  
</script> 
 
<!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" /> 
<title>Documento sin t&iacute;tulo</title> 
</head> 
 
<body> 
<form action="procesa_datos2.php" method="get"> 
<table width="60%" border="0" cellspacing="0" cellpadding="0"> 
  <tr> 
    <td>Nombre</td> 
    <td><label> 
      <input type="text" name="nombre" id="nombre" /> 
    </label></td> 
  </tr> 
  <tr> 
    <td>Apellido</td> 
    <td><label> 
      <input type="text" name="apellido" id="apellido" /> 
    </label></td> 
  </tr> 
  <tr> 
    <td><label> 
      <input type="button" name="button" id="button" value="Enviar" onClick="envia_datos()" /> 
    </label></td> 
    <td>&nbsp;</td> 
  </tr> 
</table> 
</form> 
<div id="micapa"></div> 
</body> 
</html>

procesa_datos2.php

Código PHP:

  <? 
echo "Nombre: " . $_GET['nombre'] . "<br>Apellido: " . $_GET['apellido']; 
?>

Hice lo del & pero aun nada.

pr0 · #14 (**permalink**) 09/01/2008, 13:11

Tienes un error de sintaxis en el include de prototype.js

Código HTML:

<script type="text/JavaScript" src="prototype.js">

Lo correcto es:

Código HTML:

<script type="text/JavaScript" src="prototype.js"></script>
<script language="javascript">
function envia_datos(){
........
......
......
</script>

Saludos

manriquez · #15 (**permalink**) 09/01/2008, 13:40

No amigo , repare el error de sintaxis que me dijiste pero nada aun.

Explicame las siguientes cosas:

- cuando inserto un FORM en el metodo ACTION tengo que asignarle la pagina la cual va a procesar los datos?, en este caso seria procesar_datos2.php ??

- en el FORM tengo que poner la propiedad METHOD="get" ??

- en el boton, basta con poner el metodo envia_datos() ??

Esperando una solucion.

pr0 · #16 (**permalink**) 09/01/2008, 14:33

Lo he probado yo mismo y funciona. Tu pagina procesa_datos.php tiene que quedar asi, copiala tal cual:

Código HTML:

<!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" />
<title>Documento sin t&iacute;tulo</title>
<script type="text/JavaScript" src="prototype.js"></script>
<script language="javascript">
function envia_datos(){
   var capa = $('micapa'); //esto es equivalente a document.getElementById('id_capa')
   var nombre = $('nombre').value;
   var apellido = $('apellido').value;
   var pars = 'nombre=' + nombre + '&apellido=' + apellido;
   if (!capa) return false;
    new Ajax.Updater(capa, 'procesa_datos2.php'{
        method: 'get',
        parameters: pars
    });
} 
</script>
</head>

<body>
<form method="get">
<table width="60%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>Nombre</td>
    <td><label>
      <input type="text" name="nombre" id="nombre" />
    </label></td>
  </tr>
  <tr>
    <td>Apellido</td>
    <td><label>
      <input type="text" name="apellido" id="apellido" />
    </label></td>
  </tr>
  <tr>
    <td><label>
      <input type="button" name="enviar" id="enviar" value="Enviar" onClick="envia_datos()" />
    </label></td>
    <td>&nbsp;</td>
  </tr>
</table>
</form>
<div id="micapa"></div>
</body>
</html>

manriquez · #17 (**permalink**) 09/01/2008, 22:15

No me vas a creer , pero a mi no me resulta. Si a ti te resultó, eso quiere decir que la funcion prototype.js la debo tener mala, u otra cosa.

Si a ti te resulto es porque el archivo procesar_datos2.php esta correcto.

Ayuda please...!!

pr0 · #18 (**permalink**) 10/01/2008, 05:22

Edito:

hay un fallo de sintaxis en esta linea:

Código HTML:

new Ajax.Updater(capa, 'procesa_datos2.php'{

deberia ser:

Código HTML:

new Ajax.Updater(capa, 'procesa_datos2.php',{

Saludos

manriquez · #19 (**permalink**) 10/01/2008, 06:21

Muchas gracias amigo pr0, enhorabuena, resulto que ahora puedo cargar en una capa el resultado de un formulario. Solo era un error de sintaxis.

Algunas recomendaciones o porque no usar iframe???

pr0 · #20 (**permalink**) 10/01/2008, 07:03

yo la verdad es ke no soy muy partidario de los iframe. Si lo ke necesitas es ke el div tenga scroll simplemente haz uso de los tipicos javascripts que rondan por ahí para añadirle scroll a tu div.
Por otro lado acuerdate de añadirle la propiedad style="position: relative" a tu div sino quieres que se solape con otros componentes de tu formulario o pagina una vez metas dicho div en una tabla.

manriquez · #21 (**permalink**) 10/01/2008, 07:48

Ayudame una vez mas por favor.

Ahora que consegui reemplazar el iframe por capas, no me resultan algunas funciones que yo creé.

Lo que tenia antes (con iframe), en el caso de un login. Tenia 2 campos de textos y boton y debajo de este tenia un iframe de 300 X 100 y era para que cuando el usuario ingresaba sus datos, la respuesta me arrojara en el iframe y no en otra pagina, visualmente se veia super bien. Cuando un usuario ingresaba mal sus datos, en el iframe arrojaba la respuesta de que sus datos estaban mal ingresado, etc. En el caso de que el usuario ingresaba correctamente sus datos, aparecia un mensaje de "ingresando al sistema, por favor espere..." al cabo de 1 segundo, se REDIRECCIONABA automaticamente al sistema.

Ahora va el problema, usando ahora capas en vez de iframe, la funcion redireccionar no me funciona solo queda en : "ingresando al sistema, por favor espere...", crei que era una cosa de rutas de redireccionamiento, pero por mas que le cambie el formato de ruta no funcionaba.

en seudo codigo funciona mas o menos asi.

Login.php

<campo1>
<campo2>
<boton>
<capa id= respuesta>

Validar.php

if "login correcto"
{
print "Ingresando al sistema, por favor espere..."
redireccionar("inicio.php")
}
else print "los datos no se encuentran en la BD";

function redireccionar

Código PHP:

 
function redireccionar($pagina,$seg) 
       { 
?>           
          <script LANGUAGE="JavaScript"> 
          var pagina="<? echo $pagina; ?>" 
          function redireccionar() 
          { 
             top.location.href=pagina 
          } 
          setTimeout ("redireccionar()", <? echo $seg;?>000); 
            </script> 
<?             
      }

Cuando usaba los iframe no tenia ningun problema con esta funcion, me redireccionaba automaticamente entregandole la url destino + el tiempo en segundos, pero ahora al usar capas no funciona.

Alguna sugerencia o usar una nueva funcion de redireccionamiento con tiempo, o tal ves sea solo una cosa de ruta de archivo.

/Presentacion/login.php ----->/Negocio/validar.php------->/Presentacion/inicio.php

esa es la secuencia en caso de que el usuario ingrese correctamente sus datos.

/Negocio/validar.php----->/Negocio/redireccionar.php------>/Presentacion/inicio.php

Espero que me puedas ayudar nuevamente amigo y gracias nuevamente.

manu1114 · #22 (**permalink**) 04/05/2011, 08:26

Buenas Dias!

Quien me podria resolver esta duda...

La forma en que yo construyo mi matriz es de la siguente forma:

$matrizepin["matrizgestion"][md5($terid)] = array(
"cccliente" => $cccliente,
"nombrecliente" => $nombrecliente,
"apellidocliente" => $apellidocliente,
"fehcha" => $fehcha,
"tot" => $tot,
"evento" => $evento,
"id"=>$id,
);
Y necesito enviar esta informacion a otro php...por medio del ajax... quien me ayuda?