martes, 31 de marzo de 2009

ComboBox remoto con GWT-EXT (json,jsp) con Java

Bueno supongamos que tenemos una tabla en alguna bd, y lo único que nos interesa es hacer un combobox que muestre un nombre y que tenga como value una clave:

sql:
select cvetpocit,nomtpocit from reftpocit

el modelo seria algo como esto:

/**
*
* @author isaac
*/
public class Citacion {

private String cve;
private String nombre;

public String getCve() {
return cve;
}
public void setCve(String cve) {
this.cve = cve;
}
public String getNombre() {
return nombre;
}
public void setNombre(String nombre) {
this.nombre = nombre;
}
}

el contenedor hecho con una conexion jdbc de java:


import conexion.connectionSelGWT;
import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.List;
import xxx.xxx.client.referencia.modelo.Citacion;

/**
*
* @author isaac
*/

public class ContenedorTpoCitacion {

private Connection conexion;
private Statement instruccion;

public ContenedorTpoCitacion() throws SQLException {
connectionSelGWT conectaBase = new connectionSelGWT();
conexion = conectaBase.conectBase();
}

public List<Citacion> getTpoCitacion() throws SQLException{
List<Citacion> list = new ArrayList<Citacion>();
String query = "select cvetpocit,nomtpocit from reftpocit";
instruccion = conexion.createStatement();
ResultSet resultados2 = instruccion.executeQuery(query);
while (resultados2.next()) {
Citacion citacion = new Citacion();
citacion.setCve(resultados2.getString(1));
citacion.setNombre(resultados2.getString(2));
list.add(citacion);
}
resultados2.close();
conexion.close();
return list;
}

}


Esta es clase de la conexion aunque pueden ocupar la suya, despues voy a hacer un ejemplo con hibernate:


import java.sql.*;
import java.util.Vector;


/**
* A Class class.
*


* @author Mew
*/


public class connectionSelGWT{

private Connection conexion;
public Connection conectBase(){
String URL = "jdbc:oracle:thin:@suip_o_localhost:1521:su_SID";
String userid = "su_usuario";
String password= "su_pass";
connect();
try {
conexion = DriverManager.getConnection(URL, userid, password);

}catch (SQLException E) {
return conexion=null;
}

return conexion;
}

}

El contenedor:

import conexion.connectionSelGWT;
import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.List;
import xxxx.xxx.referencias.modelo.Citacion;

/**
*
* @author isaac
*/
public class ContenedorTpoCitacion {
private Connection conexion;
private Statement instruccion;

public ContenedorTpoCitacion() throws SQLException {
connectionSelGWT conectaBase = new connectionSelGWT();
conexion = conectaBase.conectBase();

}

public List getTpoCitacion() throws SQLException{
List list = new ArrayList();

String query = "select cvetpocit,nomtpocit from reftpocit";

instruccion = conexion.createStatement();



ResultSet resultados2 = instruccion.executeQuery(query);
while (resultados2.next()) {
Citacion citacion = new Citacion();
citacion.setCve(resultados2.getString(1));
citacion.setNombre(resultados2.getString(2));
list.add(citacion);

}
resultados2.close();
conexion.close();
return list;
}

}

La clase que crea la estructura del json para la vista:



import java.sql.SQLException;
import java.util.List;
import java.util.logging.Level;
import java.util.logging.Logger;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
import xxx.xxx.client.referencia.modelo.Citacion;

/**
*
* @author isaac
*/
public class JsonCitacion {

public String getTpsCitacion() throws JSONException, SQLException{
ContenedorTpoCitacion con = new ContenedorTpoCitacion();
List<Citacion> list = con.getTpoCitacion();
JSONObject jsonObj = new JSONObject();
jsonObj.put("totalCount",list.size()+"");
JSONArray array = new JSONArray();
for(Citacion ci:list){
JSONObject jsonDatos = new JSONObject();
jsonDatos.put("cve",ci.getCve());
jsonDatos.put("nombre",ci.getNombre());
array.put(jsonDatos);
}

jsonObj.put("datos",array);
return jsonObj.toString();
}

public static void main(String[] args) {
JsonCitacion json = new JsonCitacion();

try {

System.out.println(json.getTpsCitacion());

} catch (JSONException ex) {

Logger.getLogger(JsonCitacion.class.getName()).log(Level.SEVERE, null, ex);

} catch (SQLException ex) {
Logger.getLogger(JsonCitacion.class.getName()).log(Level.SEVERE, null, ex);
}
}
}


la estructura que recibiria el combo de GWT-EXT seria la siguiente:

{"totalCount":"2","datos":[{"nombre":"Periodica","cve":"1"},{"nombre":"No Periodica","cve":"2"}]}

* las xxx son paquetes con nombre de mi trabajo pero bien le pueden poner otro nombre, es para que no vean donde trabajo jijijiji+++++.

el jsp llamado jsoncitas.jsp


<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@page import="xxx.xxxx.referencias.mc.JsonCitacion"%>
<%@page import="java.sql.SQLException"%>
<%@page import="org.json.*"%>



<% JsonCitacion json = new JsonCitacion(); try { out.print(json.getTpsCitacion()); } catch (JSONException ex) { } catch (SQLException ex) { } %>

y por ultimo el combox solo pondre el codigo del combo, solo lo tienen que agregar a un panel y listo:

HttpProxy dataProxy = new HttpProxy("jsoncitas.jsp");
RecordDef recordDef = new RecordDef(new FieldDef[]{
new StringFieldDef("cve", "cve"),
new StringFieldDef("nombre", "nombre")
});
JsonReader reader4 = new JsonReader(recordDef);
reader4.setRoot("datos");
reader4.setTotalProperty("totalCount");
Store store5 = new Store(dataProxy, reader4);
store5.load();

final ComboBox cbCitacion = new ComboBox();
cbCitacion.setStore(store5);
cbCitacion.setForceSelection(true);
cbCitacion.setMinChars(1);
cbCitacion.setFieldLabel("Tipo citación");
cbCitacion.setDisplayField("nombre");
cbCitacion.setMode(ComboBox.REMOTE);
cbCitacion.setTriggerAction(ComboBox.ALL);
cbCitacion.setEmptyText("Enter tpo citación");
cbCitacion.setLoadingText("Searching...");
cbCitacion.setTypeAhead(true);
cbCitacion.setSelectOnFocus(true);
cbCitacion.setWidth(200);
cbCitacion.setHideTrigger(false);
cbCitacion.addListener(new ComboBoxListenerAdapter() {

public void onSelect(ComboBox comboBox, Record record, int index) {

String tpoCita = Integer.parseInt(record.getAsString("cve"));
MessageBox.alert("hola "+tpoCita);
}
});

y por ultimo les debe quedar algo como esto:


4 comentarios:

Anónimo dijo...

y como se usa un grid con base de datos???? estoy q busco y no encuentro absolutamente nada. por eso comentan todos que todos nos quedamos en los demos de ext.

sabras como se hacen grids con base de datos? no solo que se muestre eso sio es facil, lo que no encuentro es como obtener son los valores (objetos) y trabajar con ellos... sabras?

Unknown dijo...

hola disculpa como puedo formar una consulta sql con tan solo sleecionar combos y campos de texto para las tablas y condiciones estoy utilizando jquery

Diana dijo...

Que tranza amigo isaac, saca las chelas, o ya como eres hombre de negocios y desarrollador senior ya no vas a hablarnos al mario y a mi.
Jejeje veo que aun te apasiona java, eso es bueno, no pierdas eso, yo tambien sigo desarrollado en java.

Espero verte pronto para que nos aventemos un debate como los de antes.

j. isaac legorreta dijo...

Si amiga Diana cuando quieras nos vamos a tomar unas tragos con el Mario y platicamos....