Java and Flex - CRUD (Crear, Leer, Modificar, Eliminar)

Después de una semana de "puente" hemos realizado un blog, y ahora he perfeccionado una aplicación CRUD, con Java y Flex.

Se trata de una aplicación para listar, insertar, eliminar y modificar los datos de un usuario. Esta aplicación esta desarrollada para tener un único acceso a la base de datos, lo explicare a continuación.

Vamos con los ejemplos:

+++ Código Flex +++

*** Declaración de los HTTPService que realizan una llamada  a los respectivos Servlets de Java ***


        <!-- HTTPService insertarUsuario,
             result llama a una función que recoge el id devuelto por la inserción
             y lo introduce junto con los datos del usuario en el XMLListCollection, "listUsuarios" , para tratarlos
             en el datagrid asociado a el.-->
        <s:HTTPService id="insertarUsuario" url="ServletInsertar" useProxy="false" method="POST" result="resultHandlerInsertarUsu(event)" resultFormat="e4x">
            <s:request xmlns="">
                <nombre>{txtNombre.text}</nombre>
                <apellidos>{txtApellidos.text}</apellidos>
                <direccion>{txtDireccion.text}</direccion>
                <ciudad>{txtCiudad.text}</ciudad>
                <provincia>{txtProvincia.text}</provincia>
                <pais>{txtPais.text}</pais>
                <telefono>{txtTelefono.text}</telefono>
                <fax>{txtFax.text}</fax>
                <correo>{txtCorreo.text}</correo>
                <web>{txtWeb.text}</web>
                <mensajeria>{txtMensajeria.text}</mensajeria>
            </s:request>
        </s:HTTPService>
       
        <!-- Se llama al inicio(creationComplete) y tenemos los datos de los usuarios introducidos en el datagrid -->
        <s:HTTPService id="listarUsuarios" url="ServletListar" useProxy="false" method="POST" resultFormat="e4x"/>
       
        <!-- Elimina un usuario pasandole el dg.selectedItem.id -->
        <s:HTTPService id="eliminarUsuario" url="ServletEliminar" useProxy="false" method="POST" resultFormat="e4x">
            <s:request xmlns="">
                <id>{dg.selectedItem.id}</id>
            </s:request>
        </s:HTTPService>
       
        <!-- Modifica un usuario, se le pasan los datos modificados y el id(dg.selectedItem.id) seleccionado en el dg -->
        <s:HTTPService id="modificarUsuario" url="ServletModificar" useProxy="false" method="POST" resultFormat="e4x">
           
            <s:request xmlns="">
                <id>{dg.selectedItem.id}</id>
                <nombre>{txtNombre.text}</nombre>
                <apellidos>{txtApellidos.text}</apellidos>
                <direccion>{txtDireccion.text}</direccion>
                <ciudad>{txtCiudad.text}</ciudad>
                <provincia>{txtProvincia.text}</provincia>
                <pais>{txtPais.text}</pais>
                <telefono>{txtTelefono.text}</telefono>
                <fax>{txtFax.text}</fax>
                <correo>{txtCorreo.text}</correo>
                <web>{txtWeb.text}</web>
                <mensajeria>{txtMensajeria.text}</mensajeria>
            </s:request>
           
        </s:HTTPService>


*** Declaración de los XMLListCollection ***


        <!-- Obtine la colección de usuarios -->
        <s:XMLListCollection id="listUsuarios" source="{listarUsuarios.lastResult.user}"/>
        <!-- Obtine el id (en la base de datos) del usuario insertado -->
        <s:XMLListCollection id="insertUsuarios" source="{insertarUsuario.lastResult.user}"/>




<fx:Script>
        <![CDATA[
             import mx.rpc.events.ResultEvent;
           
            /*
                Inserta un nuevo usuario.
            */
            private function insertar_Usuario():void{
                  
                    insertarUsuario.send();
   
            }
           
            /*
             * Función que introduce un usuario en un XMLListCollection "listUsuarios" 
            */
            private function resultHandlerInsertarUsu(event:ResultEvent):void {
                
                /*
                * Se declara un XML para insertarlo en listUsuarios, que esta asociado al datagrid 
                * dg(dataProvider=" {listUsuarios}")
                * Se observa que el "event" esta el id de la inserción(event.result) que se devuelve desde java.
                */
                var miXML:XML=
                    <user>
                        <id>{event.result}</id>    //
                        <nombre>{txtNombre.text}</nombre>
                        <apellidos>{txtApellidos.text}</apellidos>
                        <direccion>{txtDireccion.text}</direccion>
                        <ciudad>{txtCiudad.text}</ciudad>
                        <provincia>{txtProvincia.text}</provincia>
                        <pais>{txtPais.text}</pais>
                        <telefono>{txtTelefono.text}</telefono>
                        <fax>{txtFax.text}</fax>
                        <correo>{txtCorreo.text}</correo>
                        <web>{txtWeb.text}</web>
                        <mensajeria>{txtMensajeria.text}</mensajeria>
                    </user>
                
                // Se introduce el XML al listUsuarios
                listUsuarios.addItem(miXML);
               
            }

            /*Elimina el usuario seleccionado*/
            private function eliminar_usuario():void{
               
                eliminarUsuario.send();
                // Se eliminar el usuario seleccionado del XMLListCollection listUsuarios
                listUsuarios.removeItemAt(dg.selectedIndex);

            }       
           
        ]]>
    </fx:Script>


+++ Código Java +++

            //Inserta un usuario en la base de datos

            sql="INSERT INTO usuarios(nombre,apellidos,direccion,ciudad,provincia,pais,telefono,fax,correo,web,mensajeria) "
                        + "VALUES('" + request.getParameter("nombre") + "',"
                        + "'" + request.getParameter("apellidos") + "',"
                        + "'" + request.getParameter("direccion") + "',"
                        + "'" + request.getParameter("ciudad") + "',"
                        + "'" + request.getParameter("provincia") + "',"
                        + "'" + request.getParameter("pais") + "',"
                        + "'" + request.getParameter("telefono") + "',"
                        + "'" + request.getParameter("fax") + "',"
                        + "'" + request.getParameter("correo") + "',"
                        + "'" + request.getParameter("web") + "',"
                        + "'" + request.getParameter("mensajeria") + "')";

            intrst = stm.executeUpdate(sql);
            
            //rs obtiene el id que se ha generado en la base de datos en la inserción realizada
            ResultSet rs = stm.getGeneratedKeys();

            if( rs.next() )
                //aqui se devuelve el id hacia Flex(cliente)
                out.print(rs.getInt(1));



Como se ha podido observar hay una única llamada inicial de petición de la lista de usuarios que se introduce en un XMLListCollection (listUsuarios) y después se crea, modifica, elimina sobre esta lista. Por supuesto esta que las inserciones, modificaciones y eliminaciónes se envían al servidor y Java se encarga de todo ello devolviendo por ejemplo el id de un usuario insertado(visto en el ejemplo) y minimizando el trafico de datos entre el servidor y el cliente. De aquí lo de tener un único acceso a la base de datos, ya que si se modificara la base de datos por más de un cliente tendríamos que realizar otro trato con la lista de usuarios ya que esta podría modificarse en la base de datos y no estar actualizada en nuestro cliente.

Eso es todo amigos¡¡¡

ActionScript y Validator (StringValidator)

Hoy os voy a hablar de validar un formulario en un archivo mxml, utilizando el entorno de desarrollo flash builder(de prueba).
Utilizare StringValidator para que no se envié un formulario sin rellenar al servidor controlando los campos que sean validados.

Os pongo un ejemplo:

   <fx:Declarations>    
        <!-- Variable global booleana para poder insertar un usuario si su valor es true -->
        <fx:Boolean id="formularioNuevoUsuario"/>
 
        <!--
            StringValidator asociado a un boton "insertUsu" el cual se ejecuta cuando se activa un click (triggerEvent).     
            Si es valido pone la variable formularioNuevoUsuario="true" si no es valido lo pone a "false".
        -->
        <mx:StringValidator source="{txtNombre}" property="text" minLength="4" maxLength="20"
                            tooShortError="* Minimo cuatro caracteres" tooLongError="* Máximo veinte caracteres" required="true"
                            trigger="{insertUsu}" triggerEvent="click"
                            valid="formularioNuevoUsuario=true"
                            invalid="formularioNuevoUsuario=false"/>
   </fx:Declarations>


    <fx:Script>
        <![CDATA[
            /*
                Inserta un nuevo usuario si formularioNuevoUsuario=="true".
            */
            private function insertar_Usuario():void{          
                if(formularioNuevoUsuario){        
                    // insertarUsuario.send();
                    // currentState="ListarUsuarios";
                }               
            }
        ]]>
    </fx:Script>


    <mx:Form x="150" y="93" width="440"  textAlign="center">
        <mx:FormItem label="Nombre:" required="true">
            <s:TextInput id="txtNombre" restrict="a-z,A-Z"/>
        </mx:FormItem>
    </mx:Form>

   <!-- Llama al método insertar_Usuario() -->
   <s:Button id="insertUsu"  label="Insertar Usuario" click="insertar_Usuario()" x="155" y="450"/>

De esta manera se pueden realizar la Validación y ejecución de una inserción con todos los campos que tengamos que Validar para no llamar a una función con valores incorrectos o vacíos.

Eso es todo amigos!!!