Uso de amfPHP y FLex para interactuar con MySQL (parte 2)

Hola al fin un poco de tiempo para continuar con este tutorial, en el anterior nos quedamos hasta donde provabamos que nuestro amfPHP funcionaba bien hoy vamos a crear una pequeña clase en php con un metodo que recupera los datos de una tabla y nos muestra esos datos en un datagrid de flex.. manos a la obra..

1.- Creamos la clase php como podremos observar este archivo se debe llamar igual que el nombre de tu clase

"miClasePHP.php"

 

/**
 * @author Jose Roberto León Cruz
 * @copyright 2010
 */

class miClasePHP //nombre de mi clase- asi se debe llamar el archivo
{
    //metodo que se conectara a la base de datos y obtendra el contenido de la tabla usuarios..
    function getUsuarios() 
    {
        
     $dbhost="xxx";  // host del MySQL (generalmente localhost)
     $dbusuario="xxx"; // aqui debes ingresar el nombre de usuario
                              // para acceder a la base
     $dbpassword="xxx"; // password de acceso para el usuario de la
                              // linea anterior
     $db="tutorialFlex";        // Seleccionamos la base con la cual trabajar
     
     $mysql = mysql_connect($dbhost, $dbusuario, $dbpassword);
        
     mysql_select_db( $db ); //acemos que la bd que queremos sea la activa
            
     $sql = "select * from usuariosFlex";
             $Result = mysql_query( $sql );
             while ($row = mysql_fetch_object($Result)) {
                     $return[] = $row;//asignamos cada registro a una fila del arreglo
             }
        
    return( $return );//regresamos el arrego como tal..
    }
    
}
?>

como podemos apreciar la clase miClasePHP.php solo cuenta con un metodo: getUsuarios() el cual no recibe parametros pero si devuelve un Array que contendra todas las filas de la tabla Usuarios la ventaja de este framework esque podremos manipular ese arreglo directamente desde Flex!! y para eso simplemente necesitamos crear una clase AS3 que nos dara la MAGIA..

conexionRemota.as

 
// Archivo AS3 by Roberts
package {
  //librerias necesarias para la conexion del amfPHP
   import flash.net.NetConnection;
   import flash.net.ObjectEncoding;
        
   //clase que hereda de NetConnection
   public class conexionRemota extends NetConnection
   {  
     //Metodo que recibe la URL del gateway de nuestro amfPHP
      public function conexionRemota( sURL:String )
      {
         objectEncoding = ObjectEncoding.AMF0;
         if (sURL) connect( sURL );
      }
                
    public function AppendToGatewayUrl(s:String):void
    {
      
    }
  }
}

2.- Ya que tenemos la estructura de las dos clases debemos colocar la clase php en la carpeta services dentro del directorio raiz del amfPHP y la clase conexionRemota.as la debemos incluir en la carpeta src de nuestra aplicacion en flex.

3.- Repaso rapido:

Esta seria la estructuda de mi tabla en sql a la que vamos a accesar desde la funcion getUsuarios de la clase en php liesto ya la tengo creada ahora insertaremos algunos registrods

CREATE TABLE `usuariosFlex` (
`id_usuario` INT NOT NULL AUTO_INCREMENT ,
`nombre_usuario` VARCHAR( 200 ) NOT NULL ,
`edad_usuario` INT NOT NULL ,
PRIMARY KEY ( `id_usuario` )
);) 

INSERT INTO `usuariosFlex` ( `id_usuario` , `nombre_usuario` , `edad_usuario` )
VALUES (
'', 'Jose Roberto Leon', '23'
);

INSERT INTO `usuariosFlex` ( `id_usuario` , `nombre_usuario` , `edad_usuario` )
VALUES (
'', 'Juan Carlos Leon ', '13'
);


INSERT INTO `usuariosFlex` ( `id_usuario` , `nombre_usuario` , `edad_usuario` )
VALUES (
'', 'Fulanito equis', '53'
);

bien ahora si ya que tenemos todos los pasos necesarios (la tabla, la clase php que nos accede a esa tabla y su metodo que nos devuelve todos los usuarios de dicha tabla y la clase AS3 que nos permitira enlazar Flex y PHP..

4.- Vamos a Flex y creamos un nuevo proyecto le dejamos como Web Aplication y en Servert Technology lo dejamos en "None" y pulsamos siguiente con lo cual flex nos genera una nueva area de trabajo .

5.- Nos vamos a modo diseño y agregamos un Datagrid y un Boton como se ve en la imagen:



6.- Creamos una variable de tipo conexionRemota y una de tipo Array definida por el atributo [Bindable] <- este es para que esa variable pueda ser reconocida dentro del codigo AS3 y tambien dentro del codigo

   
  import mx.controls.Alert; //para mensajes en ventanitas
  //******************USO DEL AMFPHP***************** 
  //declara una variable de la clase conexion remota
        private var miConexion : conexionRemota;
  
  //arreglo que recibira el contenido devuelto por el metodo php
  //(en este caso el contenido sera todos los registros de la tabla usuariosFlex)
  [Bindable]         
  private var datos:Array;
  
  private function iniciar():void
  {
   //ruta del archivo gateway del amfPHP
            miConexion = new conexionRemota( "http://logix.com.mx/robert/amfphp/gateway.php" );
            
            
  }
      
  public function cargarUsuarios():void
  {   //nombre de la clase php "punto" invocamos al metodo deseado
   miConexion.call( "miClasePHP.getUsuarios", new Responder(exitoFuncion,errorFuncion));
    /*podemos ver que dentro de Responder tenemos dos opciones
    exito y error las cuales debemos crearlas aqui en AS y seran
    invocadas dependiendo si tuvo exito o no la llamada al metodo
    getUsuarios*/
       
  }
  
  /*funcion que se invoca cuando tenga exito la llamada 
  al metodo getUsuarios recibimos un parametro el cual
  debe conicidir con el parametro que regrese php en esa
  funcion en este caso nuestro metodo php nos devuelve
  un arreglo que es el equivalente a Array en Flex*/ 
  private function exitoFuncion(resultado:Array):void
  {
   /*lo unico que vamos a hacer es asignar ese 
   arreglo devuelto por php a nuestro arreglo
   de Flex y magia*/
   datos=resultado;
  }
  /*funcion que se invoca cuando tenga error la llamada 
  al metodo getUsuarios aqui tambien recibimos un parametro
  de tipo String que contendra la cadena de error enviada
  por el php en caso de que haya error*/ 
  private function errorFuncion(error:String):void
  {
   //aqui solo vamos a mostrar el error en un Alert
   Alert.show(error);
  }
  
  
 ]]>


 
 
  
   
   
   
  
 
 
 
 

Esto seria todo lo que hay que hacer y NO SE OLVIDEN de llamar a la funcion iniciar al principio de su aplicacion en las tags ponenen initialize="iniciar();" porque sino va a marcar error en el ejemplo anterior ya esta todo funcionando corremos la aplicacion y al pulsar el boton vemos como se nos carga nuestros datos en el DataGrid y en el orden de las columnas y ademas la carga es demaciado rapida.. aa se me olvidaba lo mejor sin usar el XML..



Esto es todo para esta entrada en la siguiente veremos como añadir editar y eliminar usuarios para cotinuar con este tutorial dejen sus comentarios y sujerencias..