Haciendo Reportes con jasper en WaveMaker

Gracias al amigo rganwgar quien puso su proyecto hecho con mysql pudo ver como integrar jasper reports y wavemaker

el post es
http://dev.wavemaker.com/forums/?q=node/2713#comment-8656
y su proyecto esta en
http://dev.wavemaker.com/forums/files/JasperReports.zip
la base de datos esta en
http://dev.wavemaker.com/forums/files/JasperInsert.txt
http://dev.wavemaker.com/forums/files/jaspercreate.txt

Espero que puedan integrar jasper para generar reportes y
presentaciones directas para imprimir.

En los proximos dias hare un ejemplo pero con la base de datos Postgresql

Hasta la proxima ...Felices Fiestas para todos..

Mavirroco

Mensaje para la informar error de clave unica

El error...duplicate key violates unique constraint....en la BD PostgreSQL se puede manejar con el evento onError del liveForm...para que se informa al usuario lo que esta pasando durante el proceso. Aqui les pongo un ejemplo de este proceso.

liveForm1Error: function(inSender, inError) {
//PARA CONTROLAR QUE NO SE REPITA
if(inError.toString().split("Error: ERROR: duplicate key violates unique constraint").length==2){
window.alert("La especialidad ya existe!!! \n Por favor Ingrese nuevos datos.");
}
}

Añadir por defecto en el lookup editor

Hola les comento que pude lograr añadir un objecto... en este caso de tipo Persona a un lookup editor en el liveForm ligado a un liveView o sea un liveForm con lookup relaciones......

simplemente en el evento begin insert se coloca la relacion:

liveForm1BeginInsert: function(inSender) {
this.personaLookupEditor1.setValue("dataValue",this.serviceVariablePersona.getData());
},

this.serviceVariablePersona.getData() es un service call de tipo Personas
ademas se tiene que poner disabled al lookup editor personaLookupEditor1..nada mas
y por lo tanto sin configurar nada mas este se pone por defecto

Hacer Nuevo item desde el related panel

Este proyecto hecho en PostgreSQL muestro como hacer un insert desde el related panel... por medio de un dialogo.
Si seleccionamos la opcion "nuevo item" en el related editor(un select editor cargado con informacion relacional) . podemos observar que se abre un dialogo para poder llenar nuestra informacion que nos falta en esta lista principal de items.

Esto es lo que basicamente realiza la mini aplicacion.

Para una mejor comprensio explicare algunos puntos no comunes que tiene este aplicacion.

!) insertar en la tabla una fila en el primer registro O en el id y "Nuevo NombreEntidad" en Nombre
por ejemplo
id_categoria | nombre |
=================
0 | Nueva Categoria
1 | aaaaa
2 | bbbbb
3 | ccccc
...
2) En la pagina que vas a aplicar estos propiedades
Esto es para asociar el evento onclick con el dialogo
dojo.declare("PageProducts", wm.Page, {
start: function() {
this.connect(app.pageDialog.domNode,"click", this, "click");
},
click: function(e) {
.....
},
_end: 0
});
esto es para filtrar el evento si estas clickeando en el boton Ok o si estas cerrando el dialogo => e.target.id == "app_pageDialog"
pageDialog
click: function(e) {
if(e.target.id == "app_pageDialog"){
....
}
},
esto es para actualizar el nuevo valor en el related editor: this.categoryLookupEditor1.update();
cortersia de Ed Callahan...the ingeniero WM ..
click: function(e) {
if(e.target.id == "app_pageDialog"){
this.categoryLookupEditor1.update();
}
}
Nada mas espero que pueda ser ayuda :)

Fuentes:

http://dev.wavemaker.com/forums/files/NewItemByDialog.zip
http://dev.wavemaker.com/forums/files/newitem.sql_.txt
http://dev.wavemaker.com/forums/files/screenshots.zip

Master Detail V2 en WM4

1)Importar la  base de datos "master_detai_db"

2)Crear liveViews para el master y el detail en LiveView panel

- masterView -> seleccionar todos los checkboxes y guardar

- detailView ->  seleccionar todos los  checkboxes y guardar

  

3)En el designer

- cambiar en layoutBox la propiedad "box" : de Top_to_Botton a Left_to_Right

- en el palette añadir 2 templates "SearchListDetail" y aplicar flex en los 2

4)Crear variables

 Crear 1 liveVariable para el master ->liveSource : masterView y quitarle el seleccionado a la propiedad autoUpdate

 Crear 1 liveVariable para el detail ->liveSource : detailView y quitarle el seleccionado a la propiedad autoUpdate

 Crear 1 variable para el actual master ->type : Master

5) Enlazar(Bind)..... master y detail con los widgets

Para el master:

   - Bind dataGrid1 con el liveVariable1 

- Bind liveVariable1 con el dataGrid1.selectedItem

Para el:

   - Bind dataGrid2 con el liveVariable2 

- Bind liveVariable2 con el dataGrid2.selectedItem

        Para el  actual_master:

- Bind variable1 -> dataSet -> idMaster con el liveForm1.dataOutput.idMaster

6) Filtrar el liveVariable2 para mostrar los datos del detail 

    - Bind detail -> master -> idMaster con el liveForm1.dataOutput.idMaster

    - En el liveForm2 -> event -> OnSuccess  -> liveVariable2

    - En el  dataGrid1 -> event -> OnSelected -> liveVariable2

7) Seleccionar el widget liveForm2 para poner el actual_master en el  related panel

- Seleccionar el widget masterSalesRelatedEditor1 y cambiar la propiedad "editingMode" : de lookup a readonly

   - Crear un evento en BeginInsert con javascript y colocar:

 liveForm2BeginInsert: function(inSender) {

    this.masterSalesRelatedEditor1.setDataSet(this.variable1);

 },

8) En la funcion inicial de la pagina poner: 

  start: function() { 

                      this.liveVariable1.update();  

                   }

Link del How To en WaveMaker

Fuentes:

Base de datos en PostgreSQL

Proyecto

Ejemplo de Master Detail en WM4

En esta aplicacin muestro el uso de un maestro detalle usando solo liveVariables para normales aplicaciones CRUD y liveView para CRUD relacionales eso es todol...

este es mi codigo que tengo que añadir en "pagina Sales" ......
dojo.declare("Sales", wm.Page, {
start: function() {

},
liveForm1Success: function(inSender, inData) {
//this shows the detail panel and filter the detail datagrid for current sale
this.panel2.setValue("showing",true);
this.liveVariable2.update();
},
dataGrid1Selected: function(inSender, inIndex) {
//this shows the detail panel and filter the detail datagrid for current sale and go to layer for show all complete sale
this.panel2.setValue("showing",true);
this.liveVariable2.update();
this.gotoLayer2.update();
},
newSaleButtonClick: function(inSender, inEvent) {
//this hide the detail panel and prepar to insert a new master sale
this.editPanel1.beginDataInsert();
this.panel2.setValue("showing",false);
},
_end: 0
});
tambien uso un trigger para actualizar id_master actual en el detalle
CREATE OR REPLACE FUNCTION set_last_master_id()
RETURNS "trigger" AS
$BODY$declare
_id_master integer;
begin
_id_master=0;
select max(id_master) into _id_master from master_sales;
new.id_master=_id_master;
return new;
end;$BODY$
LANGUAGE 'plpgsql' VOLATILE;
--------------------------------------------------------------------
CREATE TRIGGER "beforeInsertSetLastMasterId"
BEFORE INSERT
ON detail_sales
FOR EACH ROW
EXECUTE PROCEDURE set_last_master_id();
---------------------------------------------------------------------
Note: las liveVariables no esta actualizando por defecto
Espero q pueda ayudarte :)
Fuentes:
http://dev.wavemaker.com/forums/files/MasterDetailProject.zip
http://dev.wavemaker.com/forums/files/master_detail_db.sql_.txt
http://dev.wavemaker.com/forums/files/master_detail_db.jpg

Uso de Expresiones en WM4

El uso de liveForm y liveVarialbles es excelente pero lo mas util que pude observar es el uso de expresiones como por ejemplo en mi select editor para una tabla relacionada.

Antes en WM3 esto solo me podia mostrar un solo valor pero ahora puedo colocar los que quiera

displayExpression : ${nombre} + " " + ${pap}

Ya se lanzo WaveMaker 4.0 !!

El nuevo WaveMaker 4.0 recientemente a lanzado este excepcional framework para el desarrollo de aplicaciones de forma visual, rapida y con menos codigo.

Una de las cosas que voy a destacar es el uso de liveVariables (cargadas de insert, update, delete y list) y liveForms (formulario que generan todo los editores e incluidos los botones new,update, delete, guardar y cancelar).

El uso de la propiedad displayExpression (http://dev.wavemaker.com/forums/?q=node/2237) tambien me llamo la atencion debido a que puedo cambiar la forma en la que veo mi informacion relacional en el aplicaciones con CRUD con tablas relacional.

Ademas de la nueva version pueden ver que tambien actualizaron la pagina www.wavemaker.com con un precioso tema azul.
Aqui pueden ver al equipo de ingenieros de WaveMaker brindando este lanzamiento.

Volviendo un poco al pasado, les puedo comentar lo horrible y tedioso que es programar en consola y compilar para ver si tenemos errores y a veces no poder encontrarlo, pero desde que conoci a WaveMaker esto ya no pasara jamas.

WaveMaker 4.0 Beta

La gente de WM ya esta trabajando duro para sacar la version 4. Les cuento como participante para testear esta version que es una version que simplifica muchas cosas en el proceso de crear aplicaciones con el patron CRUD. Realmente esta version se distingue por la simplicidad en hacer aplicaciones de alta calidad. Espero que pueda seguir creciendo y conservar la linea de un studio de facil adaptacion para los usuarios novatos.

Usando un preloader para tus proyectos en WaveMaker

La mayoria de los clientes quieren saber si su sitio web es rapido..
A muchos no les gusta esperar mucho tiempo y seguir viendo esa pantalla blanca..
La mejor forma de informar al cliente y tranquilizar su espera es utilizando un preloader "una precarga".

Aqui les muestro como pueden cargar a su codigo y utilizando un codigo de preloader para javascript...

Web: http://www.gerd-tentler.de/tools/loader/
Bajar desde: http://www.gerd-tentler.de/tools/loader/main.php?page=download
poner en index.html


el loader 1 y loader 2 son dos archivos de js-loader

Premio a la contribucion en WaveMaker

Es un honor poder ayudar a la comunidad de WaveMaker y poder seguir seguir aportando nuevas ideas y buscar soluciones y ayuda de la comunidad.
Con esta gesto de la gente de WaveMaker espero que otras personas de hispanoamerica puedan conocer y poder contruibuir a esta gran empresa de desarrollo web.

Aqui esta mi grata noticia este dia:

iPod RockStars

Submitted by root on Tue, 07/08/2008 - 14:43.

• News and Announcements

About a month ago, we found this nice 20GB classic iPod here at WaveMaker and I offered to send it to the most helpful community member.
Since then we've seen our community grow and grow ! People have been getting involved. Sharing ideas. Helping each other. Sharing videos and laughs too.
I think we all would agree that Mavirroco has become a core community member this month. Thus it is my pleasure to send the iPod to our friend in Bolivia. Congratulations Mavirroco !
Honorable mention also goes to: WhoAmI, Zpeskin and DeadBeef. These three have also made significant contributions to the community this month and I will happily be sending them an iPod Shuffle, in WaveMaker Blue of course.
Congratulations to all our WaveMaker Community Rockstars and thanks to everyone for their participation in the community.
Ed Callahan

Gracias WM

Paginador con el dataGrid

Cuando tienes muchos registros para mostrar, la manera mas comoda en la Web( debido al tiempo de carga) es hacerlo con un paginador.

Aqui hay un proyecto de ejemplo de como se puede crear un paginador en un dataGrid

http://dev.wavemaker.com/forums/files/PagingV3.zip

Estado de las Peticiones Ajax Complejas

Para un modo mas interactivo con el usuario se utilzan esta ventanita para informar lo que esta pasando en el momento y no pensar que la aplicacion ya no responde.
Creo una pagina llamada Cargando donde mostrare mi mensaje cuando este la peticion en espera.

mi serviceCall se llama getAfiliadoList y invoco a la pagina Cargando con un modalDialgo
antes de ejecutar el servicall. Cuando termino de ejecutar solo lo hago desaparecer.

getAfiliadoListBeforeUpdate: function(inSender, ioInputData) {
app.pageDialog.showPage("Cargando",true,150,50);
},
getAfiliadoListSuccess: function(inSender, inData) {
app.pageDialog.dismiss();
},

para mas informacion en la comunidad de WaveMaker se creo este post interesante:
con un proyecto de ejemplo basico
http://dev.wavemaker.com/forums/?q=node/1770#comment-5287

Publicacion del desarrollo del Sitio de ColMed Tarija

Con mucho gusto puedo recibir por parte de WaveMaker una invitacion para poder realizar esta publicacion la cual indica como se realizo y las soluciones a los problemas para desarrollar el Sitio Web de ColMed.

Por otra parte se comento tambien la manera de encontrar una herramienta util y para desarrollo rapido de ultima tecnoligia y con elementos open source destacados como Dojo, Hibernate, JSON, SpringFramework entre otros.

Es un orgullo poder impulsar y destacar a los profesionales de esta ciudad Tarija en esta area del desarrollo de software es por eso que seguire haciendo lazos en las companias mas importantes del momento como las ya consagradas en esta area.

Esta publicacion (esta en ingles) la pueden visitar desde aqui http://www.wavemaker.com/solutions/case_study_uajms.html

Mejorando el Login Panel

Podemos mejorar el Login Panel con estos dos complementos utiles: Campo de Entrada de Usuario seleccionado o con "focus" y Evento Enter en Ingresar (ya explicado en el Post "Eventos del Teclado").

Para poder poner por defecto el Campo de Entrada de Usuario seleccionado o con "focus" se aumenta el codigo en el Script de inicio o Start:

start: function() {
dojo.byId("dijit_form_ValidationTextBox_0").focus();
},

donde dijit_form_ValidationTextBox_0 es el Campo de Entrada de Usuario y lo podemos confirmar con el Firebug haciendo una inspeccion sobre el mismo y leyendo el atributo id del objeto


Informacion redactada del link http://dev.wavemaker.com/forums/?q=node/1474

Select Editor seleccionado por defecto

Select Editor seleccionado por defecto o cuando se inicie la pagina donde se encuentran.



Primero tenemos que colocar nuestro Select editor "organizacionEditor1" en el Panel donde queremos trabajar.
Si tenemos por ejemplo un serviceCall que devuelva una listado de la base de datos por ej. "getOrganizacionList" y luego uniremos el serviceCall con el Select editor.
lo que haremos es crear un evento onSuccess y elegir codigo javascript todo esto del serviceCall "getOrganizacionList".

y en el script de onSucces colocamos:

getOrganizacionListSuccess: function(inSender, inData) { this.organizacionEditor1.setDataValue(1); },

setDataValue(1) representa que se esta seleccionado el primer item del select editor.

Eventos del teclado

Se pueden crear eventos del teclado y unirlos a un determinado widget como por ejemplo:

Al presionar Enter en el turbo.Editor de la Contraseña en el Login Panel (Panel de Acceso)
podemos ejecutar el boton Iniciar








Este el codigo fuente:

dojo.declare("Login", turbo.Part, {
start: function() {
this.connect(this.passwordInput.domNode,"keyup", this, "keyup");
},
loginButtonClick: function(inSender) {
var def = dojo.xhrPost({
url: 'j_acegi_security_check',
content : {
j_username : this.usernameInput.getDataValue(),
j_password : this.passwordInput.getDataValue(),
acegiAjaxLogin : 'true'
},
handleAs: "json",
load: function(response, ioArgs) {
if (response.url) {
location.href = response.url;
} else if (response.error) {
app.login.loginErrorMsg.setCaption("Usuario o Contraseña incorrectos.");
}
}
});

},
keyup: function(e) {
if (e.keyCode == dojo.keys.ENTER)
turbo.fire(this.loginButton, "onclick");
},
_end: 0
});

Consultas Utiles HQL

Seleccionar las ultimas 4 noticias
Query Name: getRecientNotices
Query: from Noticia n where n.id >= ( select (max(m.id)-4) from Noticia m) order by n.id desc

Consultas Utiles HQL

Buscar socios por especialidad
Query Name: getSocioByEspecialidad
Query: from Socio s where upper(s.especialidad) like upper('%'||:esp||'%')

Consultas Utiles HQL

Listar las actividades del mes y año actual




Query Name: getActividadActual
Query: from Actividad a where a.ano=(extract(year from current_timestamp())) and a.mes=CASE WHEN (extract(month from current_timestamp()))=1 THEN 'Enero'
WHEN (extract(month from current_timestamp()))=2 THEN 'Febrero'
WHEN (extract(month from current_timestamp()))=3 THEN 'Marzo'
WHEN (extract(month from current_timestamp()))=4 THEN 'Abril'
WHEN (extract(month from current_timestamp()))=5 THEN 'Mayo'
WHEN (extract(month from current_timestamp()))=6 THEN 'Junio'
WHEN (extract(month from current_timestamp()))=7 THEN 'Julio'
WHEN (extract(month from current_timestamp()))=8 THEN 'Agosto'
WHEN (extract(month from current_timestamp()))=9 THEN 'Septiembre'
WHEN (extract(month from current_timestamp()))=10 THEN 'Octubre'
WHEN (extract(month from current_timestamp()))=11 THEN 'Noviembre'
WHEN (extract(month from current_timestamp()))=12 THEN 'Diciembre'

END

Usando el FCKEditor en Wavemaker

Usar un widget como el FCKEditor para las aplicaciones web de tipo CMS nos facilita la administracion de contenidos y ayuda a que la nuestra aplicacion sea mas dinamica.

En los foros de Wavemaker puedes encontrar como se realiza la inclusion de una widget de otra empresa en wavemaker este es el enlace http://dev.wavemaker.com/forums/?q=node/1624