Articulo escrito

  • el 06/11/2007
  • a las 17:50
  • por Juan

Conectar Flash con Access a traves de Mdm Zinc 33

Nov6

Ya vimos hace un tiempo como conectar Flash con Mysql a través de Zinc, pero esto nos obliga a tener conexión de internet para conectarnos al servidor o montarnos nuestro servidor en local.

A lo mejor, a la hora de hacer nuestra aplicación nos basta con tener una base de datos en access y en local, con lo que nos serviría que el cliente no tuviera conexión a internet para utilizarla.

Para este ejemplo vamos a realizar la gestión de una agenda.

Primero de todo crearemos en access una estructura como esta con id, Nombre, Apellidos y Teléfono:

Estructura de la base de datos de access

A esta tabla la llameremos "ejemplo_agenda" y a la base de datos le pondremos el mismo nombre "ejemplo_agenda.mdb". Antes de guardar todo, insertaremos unos datos en la tabla para el ejemplo.

En nuestra aplicación en flash insertaremos un DataGrid, 3 botones y 3 textinput. Al DataGrid le llamaremos "theDataGrid". Los botones "bot_editar","bot_borrar" y "bot_insertar". Y finalmente los textinput "nombre_txt","apellidos_txt" y "tlf_txt".En el escenario nos quedará una cosa como esta:

Estructura del escenario de flash

Ahora ya insertaremos una nueva capa y ahí pondremos nuestro código actionscript. Iré poniendo bloque a bloque de código para ir explicandolo.

Actionscript:
  1. var databaseFile:String = "ejemplo_agenda.mdb";
  2. var databasePassword:String = "";
  3. var path:String = mdm.Application.path+databaseFile;
  4. mdm.Database.MSAccess.connect(databaseFile,databasePassword);
  5. var success = mdm.Database.MSAccess.success();
  6. if (success == false) {
  7. var msg:String = "No se puede conectar a la bbdd";
  8. mdm.Dialogs.prompt(msg);
  9. return;
  10. }

Con ese trozo de código lo que hemos hecho es hacer la conexión con nuestra base de datos y comprobar que la conexión se ha hecho correctamente.

Actionscript:
  1. //FUNCION PARA HACER LA CONSULTA A LA BBDD
  2. function consulta(){
  3. theDataGrid.removeAll();
  4. var sqlString:String = "SELECT id,nombre,apellidos,telefono FROM ejemplo_agenda order by id asc";
  5. // Ejecutamos la consulta sql
  6. mdm.Database.MSAccess.select(sqlString);
  7. // Comprobamos los errores
  8. var error:Boolean = (mdm.Database.MSAccess.error() == "true");
  9. if (error) {
  10. var msg:String = "Ha ocurrido un error en la consulta!";
  11. mdm.Dialogs.prompt(msg);
  12. return;
  13. }
  14. //Obtenemos los datos de la consulta
  15. var dataSet:Array = mdm.Database.MSAccess.getData();
  16.  
  17. var datos:Object;
  18. var newItemsArray:Array = new Array();
  19. for (var i = 0; i<dataset.length;>
  20. datos = {};
  21. datos.ID = parseInt(dataSet[i][0]);
  22. datos.Nombre = dataSet[i][1];
  23. datos.Apellidos = dataSet[i][2];
  24. datos.Telefono = dataSet[i][3];
  25. newItemsArray.push(datos);
  26. }
  27. theDataGrid.dataProvider = newItemsArray;
  28. }

La función consulta lo que hace es una consulta a la tabla de access y vuelca su contenido en el datagrid.

Actionscript:
  1. //FUNCION PARA MONTAR EL DATAGRID
  2. function layoutGUI():Void {
  3. // Montamos el encabezado del datagrid
  4. theDataGrid.setStyle("fontSize",10);
  5. theDataGrid.columnNames = ["ID", "Nombre", "Apellidos", "Telefono"];
  6. theDataGrid.vScrollPolicy = "auto";
  7.  
  8. var gridWidth:Number = theDataGrid.width;
  9.  
  10. theDataGrid.getColumnAt(0).width = 0.05*gridWidth;
  11. theDataGrid.getColumnAt(0).headerText = "ID:";
  12.  
  13. theDataGrid.getColumnAt(1).width = 0.35*gridWidth;
  14. theDataGrid.getColumnAt(1).headerText = "Nombre:";
  15.  
  16. theDataGrid.getColumnAt(2).width = 0.45*gridWidth;
  17. theDataGrid.getColumnAt(2).headerText = "Apellidos:";
  18.  
  19. theDataGrid.getColumnAt(3).width = 0.15*gridWidth;
  20. theDataGrid.getColumnAt(3).headerText = "Telefono:";
  21.  
  22. theDataGrid.setStyle("alternatingRowColors", [0xFFFFFF, 0xF9FCFD]);
  23. }

La función layoutGUI monta la estructura del datagrid ( encabezado, ancho, alto, color de fondo, etc ).

Ahora ya simplemente nos quedan las funciones de los respectivos botones:

Actionscript:
  1. //Funcion para insertar un dato
  2. bot_insertar.onRelease=function(){
  3. if(nombre_txt.text==""){
  4. nombre_txt.text="Este campo no puede estar vacio";
  5. }else{
  6. mdm.Database.MSAccess.runQuery("INSERT INTO ejemplo_agenda (nombre,apellidos,telefono) VALUES ('"+nombre_txt.text+"','"+apellidos_txt.text+"',"+telf_txt.text+")");
  7. consulta();
  8. nombre_txt.text="";
  9. apellidos_txt.text="";
  10. telf_txt.text="";
  11. }
  12. }

Antes de insertar un dato, comprobamos que el campo nombre no esté vacio. Después de insertar los datos, llamaremos a la funcion consulta para actualizar el datagrid y limpiaremos los textinput.

Actionscript:
  1. //Borrado de datos
  2. bot_borrar.onRelease=function(){
  3. LineaGrid = theDataGrid.selectedIndex;
  4. if(LineaGrid!=undefined){
  5. var sqlString:String = "DELETE FROM ejemplo_agenda where id="+theDataGrid.getItemAt(LineaGrid).ID;
  6. mdm.Database.MSAccess.runQuery(sqlString);
  7. consulta();
  8. }
  9. }

En este trozo de código no hay mucho que explicar, simplemente hacemos el borrado si se ha elegido un dato en el datagrid.

Actionscript:
  1. //Edicion de datos
  2. theDataGrid.addEventListener("change", editar);
  3.  
  4. function editar(Obj) {
  5. bot_editar.enabled=true;
  6. //Obtiene los datos de la linea seleccionada
  7. DatosGrid = Obj.target.selectedItem;
  8. //Asigna valores de los campos de texto
  9. nombre_txt.text = DatosGrid.Nombre;
  10. apellidos_txt.text = DatosGrid.Apellidos;
  11. telf_txt.text = DatosGrid.Telefono;
  12. }
  13.  
  14. bot_editar.onRelease=function(){
  15. LineaGrid = theDataGrid.selectedIndex;
  16. var sqlString:String = "UPDATE ejemplo_agenda set nombre='"+nombre_txt.text+"', apellidos='"+apellidos_txt.text+"', telefono="+telf_txt.text+" where id="+theDataGrid.getItemAt(LineaGrid).ID;
  17. mdm.Database.MSAccess.runQuery(sqlString);
  18. consulta();
  19. bot_editar.enabled=false;
  20. nombre_txt.text = "";
  21. apellidos_txt.text = "";
  22. telf_txt.text = "";
  23. }

Para editar los datos lo que hemos hecho es ponerle un listener al datagrid para que cuando se seleccione un elemento, nos lo muestre en los textinput.

El último trozo de código que nos quedaría por poner es el siguiente:

Actionscript:
  1. bot_editar.enabled = false;
  2. layoutGUI();
  3. consulta(); //Obtenemos los datos de la bbdd

Esto son las llamadas a la funcion de montar el datagrid y obtener los datos del access.

Al haberlo explicado por trozos puede haber quedado algo lioso, ahora os pondré todo el código seguido que hemos utilizado.

Actionscript:
  1. var databaseFile:String = "ejemplo_agenda.mdb";
  2. var databasePassword:String = "";
  3. var path:String = mdm.Application.path+databaseFile;
  4. mdm.Database.MSAccess.connect(databaseFile,databasePassword);
  5. var success = mdm.Database.MSAccess.success();
  6. if (success == false) {
  7. var msg:String = "No se puede conectar a la bbdd";
  8. mdm.Dialogs.prompt(msg);
  9. return;
  10. }
  11.  
  12. //FUNCION PARA HACER LA CONSULTA A LA BBDD
  13. function consulta(){
  14. theDataGrid.removeAll();
  15. var sqlString:String = "SELECT id,nombre,apellidos,telefono FROM ejemplo_agenda order by id asc";
  16. // Ejecutamos la consulta sql
  17. mdm.Database.MSAccess.select(sqlString);
  18. // Comprobamos los errores
  19. var error:Boolean = (mdm.Database.MSAccess.error() == "true");
  20. if (error) {
  21. var msg:String = "Ha ocurrido un error en la consulta!";
  22. mdm.Dialogs.prompt(msg);
  23. return;
  24. }
  25. //Obtenemos los datos de la consulta
  26. var dataSet:Array = mdm.Database.MSAccess.getData();
  27.  
  28. var datos:Object;
  29. var newItemsArray:Array = new Array();
  30. for (var i = 0; i<dataset.length;>
  31. datos = {};
  32. datos.ID = parseInt(dataSet[i][0]);
  33. datos.Nombre = dataSet[i][1];
  34. datos.Apellidos = dataSet[i][2];
  35. datos.Telefono = dataSet[i][3];
  36. newItemsArray.push(datos);
  37. }
  38. theDataGrid.dataProvider = newItemsArray;
  39. }</dataset.length;>
  40.  
  41. //FUNCION PARA MONTAR EL DATAGRID
  42. function layoutGUI():Void {
  43. // Montamos el encabezado del datagrid
  44. theDataGrid.setStyle("fontSize",10);
  45. theDataGrid.columnNames = ["ID", "Nombre", "Apellidos", "Telefono"];
  46. theDataGrid.vScrollPolicy = "auto";
  47.  
  48. var gridWidth:Number = theDataGrid.width;
  49.  
  50. theDataGrid.getColumnAt(0).width = 0.05*gridWidth;
  51. theDataGrid.getColumnAt(0).headerText = "ID:";
  52.  
  53. theDataGrid.getColumnAt(1).width = 0.35*gridWidth;
  54. theDataGrid.getColumnAt(1).headerText = "Nombre:";
  55.  
  56. theDataGrid.getColumnAt(2).width = 0.45*gridWidth;
  57. theDataGrid.getColumnAt(2).headerText = "Apellidos:";
  58.  
  59. theDataGrid.getColumnAt(3).width = 0.15*gridWidth;
  60. theDataGrid.getColumnAt(3).headerText = "Telefono:";
  61.  
  62. theDataGrid.setStyle("alternatingRowColors", [0xFFFFFF, 0xF9FCFD]);
  63. }
  64.  
  65. //Funcion para insertar un dato
  66. bot_insertar.onRelease=function(){
  67. if(nombre_txt.text==""){
  68. nombre_txt.text="Este campo no puede estar vacio";
  69. }else{
  70. mdm.Database.MSAccess.runQuery("INSERT INTO ejemplo_agenda (nombre,apellidos,telefono) VALUES ('"+nombre_txt.text+"','"+apellidos_txt.text+"',"+telf_txt.text+")");
  71. consulta();
  72. nombre_txt.text="";
  73. apellidos_txt.text="";
  74. telf_txt.text="";
  75. }
  76. }
  77. //Borrado de datos
  78. bot_borrar.onRelease=function(){
  79. LineaGrid = theDataGrid.selectedIndex;
  80. if(LineaGrid!=undefined){
  81. var sqlString:String = "DELETE FROM ejemplo_agenda where id="+theDataGrid.getItemAt(LineaGrid).ID;
  82. mdm.Database.MSAccess.runQuery(sqlString);
  83. theDataGrid.removeItemAt(LineaGrid);
  84. consulta();
  85.  
  86. var error:Boolean = (mdm.Database.MSAccess.error() == "true");
  87. if (error) {
  88. var msg:String = "Ha ocurrido un error ejecutando la consulta";
  89. mdm.Dialogs.prompt(msg);
  90. return;
  91. }
  92. }
  93.  
  94. }
  95.  
  96. //Edicion de datos
  97. theDataGrid.addEventListener("change", editar);
  98.  
  99. function editar(Obj) {
  100. bot_editar.enabled=true;
  101. //Obtiene los datos de la linea seleccionada
  102. DatosGrid = Obj.target.selectedItem;
  103. //Asigna valores de los campos de texto
  104. nombre_txt.text = DatosGrid.Nombre;
  105. apellidos_txt.text = DatosGrid.Apellidos;
  106. telf_txt.text = DatosGrid.Telefono;
  107.  
  108. }
  109. bot_editar.onRelease=function(){
  110. LineaGrid = theDataGrid.selectedIndex;
  111. var sqlString:String = "UPDATE ejemplo_agenda set nombre='"+nombre_txt.text+"', apellidos='"+apellidos_txt.text+"', telefono="+telf_txt.text+" where id="+theDataGrid.getItemAt(LineaGrid).ID;
  112. mdm.Database.MSAccess.runQuery(sqlString);
  113. var error:Boolean = (mdm.Database.MSAccess.error() == "true");
  114. if (error) {
  115. var msg:String = "Error occured while executing sql query!";
  116. mdm.Dialogs.prompt(msg);
  117. return;
  118. }
  119. consulta();
  120. bot_editar.enabled=false;
  121. nombre_txt.text = "";
  122. apellidos_txt.text = "";
  123. telf_txt.text = "";
  124. }
  125.  
  126. bot_editar.enabled=false;
  127. layoutGUI();
  128. consulta();//Obtenemos los datos de la bbdd

Una vez hecho nuestro swf, solamente deberemos compilarlo con el mdm zinc y obtendremos nuestro ejecutable. Como nota tengo que decir que si hacemos una consulta que nos devuelve muchos registros (sobre los 150-200) puede que no funcione correctamente. En ese caso tendríamos que paginar nuestros resultados.

Este mismo tutorial lo publiqué hace ya algún tiempo en cristalab.

Posts Relacionados

  • No Related Post

subscribe to comments RSS

There are 33 comments for this post

  1. ALT dice:

    ¡Hola Juan!
    He visto tu tutorial y me parece excelente. Sin embargo, en ocasiones se hace atractivo editar los campos directamente en el datagrid y de ahi guardarlos en la base de datos. ¿es factible hacer esto? ¿tendrá por ahí algún ejemplo que me puedas facilitar?.

    De antemano, muchas gracias
    Saludos
    ALT

  2. Juan dice:

    Claro que se puede, me lo anoto para hacer un ejemplo y publicarlo en cuanto pueda en la web.

  3. [...] conexión a Access Escrito por Juan - 26 Ene 2008 a las 12:08:25 | Hace un tiempo ya hice un tutorial sobre como conectar Flash con Access a través de mdm Zinc. Y en los comentarios me preguntaron si [...]

  4. Jozet77 dice:

    oye pero si la base de datos no esta en el mismo directorio como cambio el path y donde lo hago……

  5. coda25 dice:

    hola, mi pregunta es, en donde pones los codigos para dar alta, editar y borrar? es dentro de los botones?

    grax

    atte coda25

  6. Juan dice:

    No, es en la linea principal de tiempo.

  7. coda25 dice:

    podrias mandarme el ejemplo ya hecho? con codigo fuente a mi mail:

    shadow_x20@hotmail.com

    grax

    atte

    coda25

  8. Cristian dice:

    buenas, les cuento mi problema.. un cliente necesitaba hacer un cd interactivo para publicidad y me paso una base acces de donde sacar los datos. a mi se me habia ocurrido hacerlo con flash que es mas atractivo visualmente. el problema surgio cuando lo quice conectar…. bueno, encontre esta forma pero tube 2 problemas: la base de datos y la tabla… tienen que tener el mismo nombre??? porque yo intente y nunca me mostro dato alguno.. y el otro problema que veo es que al ejecutar el .exe generado por el MDMZink se crea o se actualiza un archivo con el mismo nombre que la base, esto podia traer problemas ya que es para un cd (solo lectura)… alguien conoce otra forma???? o como resolver esto?? Muchas gracias!!!!

  9. Juan dice:

    Hola, te respondo:
    -El nombre de la tabla y el de la base de datos no tienen que tener el mismo nombre, yo los puse igual para simplificar el ejemplo pero no es necesario
    -Si vas a acceder a un cd debes hacerlo en solo lectura por lo que debes especificarlo con la funcion “mdm.Database.MSAccess.connectReadOnly” si no, no podrás. Si accedes de otra manera te genera un archivo temporal y si es en un cd no vas a poder.

  10. Cristian dice:

    muchas gracias Juan!! voy a ver si lo logro hacer andar!!!
    despues te cuento como me fue!

  11. Cristian dice:

    buenisimo che, conecto perfectamente.

    una consulta mas… (y esto de curiosidad)… intente ponerle un skin a la aplicacion esta, y no me conecta a la base, se necesita algo mas para usar skin? o le estoy errando en algo?

  12. Juan dice:

    Pues no debería porque no funcionarte al ponerle el skin. Yo he hecho aplicaciones con skin y conectandose a bases de datos (mysql) y me han funcionado perfectamente.
    Mira a ver si has puesto algún código sin darte cuenta.
    Un saludo

  13. Chewika dice:

    Hola a todos, sobre todo muy buen trabajo Juan, mi duda tras estar mirando el programa es si es posible el compilar un swf que a su vez tenga mas swf unidos al principal, por ejemplo que el swf principal tenga menus que carguen mas swf, por ahora solo conseguí que compile uno solo, sin poder hacer la llamada a los demas swf. Por ahora los swf los estoy poniendo como MC pero me gustaría saber si es posible lo que comento.

    Muchas gracias por todo.
    Saludos
    Jose

  14. Juan dice:

    Hola Jose, lo que tu comentas si que se puede mediante los mdm.Forms. En cada Form cargas un swf distinto y puedes comunicarte entre ellos, llamando a funciones de otros, minimizarlos, etc

  15. chewika dice:

    Muchas gracias juan, mirare esa opcion de los Forms, la verdad que estuve viendo algo de eso pero claro, solo añadia otro swf sin buen resultado, intentare profundizar en eso.

    muchas gracias y un saludo
    Jose

  16. Oscar Spencer dice:

    gracias por compartir

    oie estoy haciendo una aplicacion, ya casi termino,
    solo me falta recuperar los datos lugar de un datagrid en un “input text” individual cada dato ¿crees que se pueda?
    si puedes ayudarme te lo agradecere mucho

  17. Juan dice:

    Claro que se puede, en vez de meter los datos en el datagrid en el bucle (lineas 30-37) debes ponerlas en el input que quieras. Por ejemplo si tu input se llama nombre_txt:

    nombre_txt.text=dataSet[0][1];

    Asi pondrias el primer nombre de los registros que obtengas en ese campo de texto.

  18. Oscar Spencer dice:

    gracias juan voy a probar ….

  19. Oscar Spencer dice:

    al intentar copilarlo con mdm v.3 aparece este error:

    couldn´t locate runtime module: mdm.Database.MSAccess

    (el Mismo Archivo que baje, sin mofificarlo)
    creo es por la version del mdm

    a que se debera juan, de antemano gracias.

  20. Oscar Spencer dice:

    no le hagas caso a lo anterior , ya intente con otra version 3.0 y si lo copilo…

  21. Oscar Spencer dice:

    nombre_txt.text=dataSet[0][1];

    recuerdas esto , funciona, pero solamente me permite ver el primer registro .

    creo que me faltaria el codigo para que dos botones “” anterior y siguiente “” para poder ver todos los registros 1 por 1

    o de alguna manera ingresar el “id” en un inputtext para hacer una consulta y me muestre los datos de dicho registro.

    gracias por tu ayuda, segun yo con esto ya termino el proyecto.

    muchas gracias Juan

  22. Juan dice:

    Como te dije, eso te sirve para ver el primer registro del nombre.
    dataSet[i][j]

    i es el numero de fila y j el numero de columna. En el datagrid los ves todos porque en un bucle vas recorriendo las filas y leyendo todos los registros. Luego los muestras en el datagrid.

    Como lo quieres meter en un input text debes hacer algo como lo que dices, un boton de anterior o siguiente o algo asi.

  23. Edgar dice:

    Hola Juan, a mi me pasa lo siguiente:
    Cuando copilo con mdm v.3 aparece este error varias veces:

    couldn´t locate runtime module: mdm.Database.MSAccess

    Que puede ser, he visto que arriba esta el mismo comment pero yo tengo la version 3 y sigue pasandome.

    GRacias.

  24. Juan dice:

    Edgar, ¿compilas la libreria mdm.Database junto con el proyecto?
    Por defecto el mdm zinc no te compila ninguna libreria y debes añadirlas tu a la hora de compilar.

  25. Edgar dice:

    Si, la compilo, es posible que sea porque tengo windows vista? y si es asi compilandolo en XP luego funcionaria en Vista?

    Edgar.

  26. Sergio dice:

    Hola juan.

    te queria preguntar si a esa Datagrid se le puede añadir filtro, por ejemplo colocal un input para filtrar nombres y un combobox para filtrar telefonos. gracias

  27. Juan dice:

    Si que podrías pero deberás poner un listener en el input o en el combo para que cada vez que se cambie se actualice tu consulta sql.

  28. Sergio dice:

    Gracias juan

    perdona mi ignorancia pero eso como se hace es k no soy muy experto.

    te lo agradeceria bastante

  29. Sergio dice:

    Bueno al final lo hize en visual basic pk no lo pude hacer en flash (PRO TIEMPO NADA MAS) es que tenia que entregarlo rapido pero… esta buenisima esta herramienta de flash. voy a meterme mas en el asunto.

    gracias…

  30. Siver_Gos dice:

    hola, lo que quiero es saber si se puede conectar una miltimedia desarrollada en flash con un gestor de base de datos y de ser posible que e digancomo por favor que estoy medio enrredaooo, porque es para la tesis de grado mia chaoooooo deser posible me responden a mi e-mail yoandy.dominguez@reduc.edu.cu gracias

  31. Alejandro dice:

    Hola Juan es posible que me envies tu ejemplo?…te dejo mi mail alejandro_a25@hotmail.com te lo agradeceria inmensamente amigo. Adios

  32. Juan dice:

    El ejemplo lo puedes hacer facilmente, aún así lo puedes descargar de cristalab.com, el enlace está en este mismo post.

  33. cessy dice:

    hola Juan, el mismo problema con los anteriores: el error del runtime(couldn´t locate runtime module: mdm.Database.MSAccess)y depaso estoy en un proyecto de cd interactivo pero son swishmax, sorry pero no tengo idea de que liberias debo añadir, porfis si me pueden ayudar ya que es mi 1era ves en esto, muchas gracias.

Please, feel free to post your own comment

* these are required fields

Calle Serpis is powered by WordPress and FREEmium Theme.
developed by Dariusz Siedlecki and brought to you by FreebiesDock.com