Usando JSON N03 (en ExtJS)

En el lado ExtJS te toca hacer esto

var datosJSP;

var columnas;

var tabla;

var ventana;

Ext.onReady(function(){

/*

Esto es lo realmente importante en el codigo

esto es todo lo nuevo aqui la lectura de dat

os desde un JSON, funciona asi necesitamos u

n Ext.data.Store el cual define 3 parametros

importantes encapsulados en 2 valores el pri

mero es un Ext.data.JsonReader dentro de est

e se define un campo fields: que es un vecto

r que contiene en orden los campos que serán

leidos y un campo root: que define el nombre

de la variable que contiene los datos en el

JSON.

El otro es un campo proxy: este está definid

o por la url donde estan los datos en format

o JSON

*/

datosJSP = new Ext.data.Store({

reader: new Ext.data.JsonReader({

fields: ['nombre', 'apellido','apodo','telefono','correo'],

root: 'rows'

}),

proxy: new Ext.data.HttpProxy({

url: 'servlet/Listar/Contacto'

}),

autoLoad: true

});

/*columnas define datos sobre cada columna de la tabla

por ejemplo:

-header Titulo

-width Ancho

-sortable Si se puede ordenar esta columna

-dataIndex de donde se saca el dato que va en esta columna este campo es de especial cuidado

porque debe ser una variable definida en el JSON

las columnas son una matriz donde cada fila es una columna y a su vez cada espacio de cada fila es una prodiedad de dicha columna

*/

columnas =[

{header: "Nombre", width: 100, sortable: true, dataIndex: 'nombre'},

{header: "Apellido", width: 100, sortable: true, dataIndex: 'apellido'},

{header: "Apodo", width: 100, sortable: true, dataIndex: 'apodo'},

{header: "Telefono", width: 100, sortable: true, dataIndex: 'telefono'},

{header: "Correo", width: 180, sortable: true, dataIndex: 'correo'}

];

/*

un panel de grillas, mejor dicho una tabla

para los que conocen java es como un JTable

pero mucho mas funcional pues proporciona e

l metodo para ordenar y ya es un componente

visual osea no hay que agregarlo a ningun o

tro componente para visualizarlo

*/

tabla = new Ext.grid.GridPanel({

store: datosJSP,

columns:columnas,

stripeRows: true,

height:250,

width:600,

// renderTo: document.body,

title:'Lista::de::Contactos:::...'

});

ventana = new Ext.Window({

id: 'ventana',

title: '1N63N10 5W',

closable:true,

maximizable:true,

minimizable :true,

closeAction :'hide',

height: 270,

width: 620,

plain:true,

layout: 'fit',

items: tabla

});

});

Usando JSON N02 (en el controller)

para trabajar aplicaciones AJAX con ExtJS es necesario usar el MVC, debes crear una clase acciones que lea los datos de la bd y los escriba en un texto ya sea en un "text/javascript" o en un "application/x-json" la clase que yo hice es la siguiente:

package paquetes.controlador;

import paquetes.modelo.Contacto;

import paquetes.modelo.Model;

import java.io.IOException;

import javax.servlet.ServletException;

import javax.servlet.RequestDispatcher;

import java.io.PrintWriter;

import org.json.JSONObject;

import org.json.JSONArray;

import org.json.JSONException;

import java.util.ArrayList;

public class ListarContacto extends Action {

public void run()throws ServletException, IOException{

JSONObject respuesta=new JSONObject();

try {

respuesta=aJson();

}catch (Exception ex) {

throw new ServletException(ex.toString());

}

escribir(respuesta);

}

public JSONObject aJson()throws Exception{

JSONObject respuesta=new JSONObject();

JSONArray arreglo=new JSONArray();

try {

Model model= new Model();

ArrayList lista=model.listaContacto();

for (int i = 0; i

arreglo.put(i,Contacto.load(lista.get(i)));

}

}catch (Exception ex) {

respuesta.put("mensaje",ex.toString());

respuesta.put("tipo","Error");

return respuesta;

}

respuesta.put("success",true);

respuesta.put("rows",arreglo);

return respuesta;

}

public void escribir(JSONObject texto)throws IOException{

String cb = request.getParameter("callback");

boolean scriptTag = false;

if (cb != null) {

scriptTag = true;

response.setContentType("text/javascript");

} else {

response.setContentType("application/x-json");

}

PrintWriter out = response.getWriter();

response.getWriter().print(texto);

}

}

lo mas importante es:

en el metodo aJson

JSONArray arreglo=new JSONArray(); creamos un JSONArray y recorremos la lista de objetos o datos traidos de la BD y los guardamos en el array que automaticamente con el metodo que creamos en el bean el lo convierte.

Model model= new Model(); //conexion a la BD

ArrayList lista=model.listaContacto(); //datos de la BD

for (int i = 0; i

arreglo.put(i,Contacto.load(lista.get(i)));//ponemos lo que estaba en la bd en el array

}

respuesta.put("success",true);//y el proceso finalizo correctamente

respuesta.put("rows",arreglo);//ponemos la info en lo que vamos a escribir

en el metodo escribir:

escogemos que tipo de respuesta será si javascript o json, y luego obtenemos el medio para escribir y escribimos.

descargate los codigos aqui

Usando JSON N01 (en el bean)

Usando JSON (descargalo aki) json de la forma como se trabajo viene en 2 jar, cada uno con determinadas clase, pero lo importante es lo siguiente (ya sabes lo que es un bean?) :

* en tu bean importar estas clases

import org.json.JSONObject;

import org.json.JSONException;

* escribir un metodo para convertir tus datos al formati JSON

public static JSONObject load(Contacto contacto) throws JSONException {

JSONObject respuesta=new JSONObject();

respuesta.put("nombre",contacto.getNombre() );

respuesta.put("apellido",contacto.getApellido() );

respuesta.put("apodo",contacto.getApodo());

respuesta.put("telefono",contacto.getTelefono());

respuesta.put("correo",contacto.getCorreo());

return respuesta;

}

el bean quedaria asi:

package paquetes.modelo;

import java.io.Serializable;

import java.lang.Comparable;

import java.sql.ResultSet;

import java.sql.SQLException;

import org.json.JSONObject;

import org.json.JSONException;

public class Contacto implements Serializable,Comparable{

private String nombre = "";

private String apellido = "";

private String apodo = "";

private String telefono = "";

private String correo = "";

public String getNombre(){

return nombre;

}

public String getApellido(){

return apellido;

}

public String getApodo(){

return apodo;

}

public String getTelefono(){

return telefono;

}

public String getCorreo(){

return correo;

}

public void setNombre(String nombre ){

this.nombre=nombre;

}

public void setApellido(String apellido ){

this.apellido=apellido;

}

public void setApodo(String apodo ){

this.apodo=apodo;

}

public void setTelefono(String telefono ){

this.telefono=telefono;

}

public void setCorreo(String correo ){

this.correo=correo;

}

public String toString(){

return(

"DATOS:::CONTACTO:::...\n"+

"NOMBRE : "+nombre+"\n"+

"APELLIDO : "+apellido+"\n"+

"APODO : "+apodo+"\n"+

"TELEFONO : "+telefono+"\n"+

"CORREO : "+correo+"\n"+

"");

}

public static Contacto load(ResultSet rs) throws SQLException {

Contacto contacto = new Contacto();

contacto.setNombre((String)rs.getString("NOMBRE"));

contacto.setApellido((String)rs.getString("APELLIDO"));

contacto.setApodo((String)rs.getString("APODO"));

contacto.setTelefono((String)rs.getString("TELEFONO"));

contacto.setCorreo((String)rs.getString("CORREO"));

return contacto;

}

public int compareTo(Object contacto){

return (this.nombre).compareTo(((Contacto)contacto).getNombre());

}

public static JSONObject load(Contacto contacto) throws JSONException {

JSONObject respuesta=new JSONObject();

respuesta.put("nombre",contacto.getNombre() );

respuesta.put("apellido",contacto.getApellido() );

respuesta.put("apodo",contacto.getApodo());

respuesta.put("telefono",contacto.getTelefono());

respuesta.put("correo",contacto.getCorreo());

return respuesta;

}

}

Agregando librerias a NetBeans

Para agregra librerias al netbeans, pues es facil en este caso especifico te explico como agregar el JSON( Descargalo aki) cuando tu abres el proyecto web hay unas carpetas, en especifica una que se llama lib o librerias o libraries en esa carpeta le das click contrario y click en agregar jar file o archivo jar y buscas el archivo y listo ya lo puedes importar

JSON

JSON lo que quiere decir es "JavaScript Object Notation", es un "formato" para pasar informacion, es una cuestion bien simple en el formato JSON se puede pasar datos:

campo:valor,campo2:valor

para mas info entra en http://www.json.org/.

JSON es una vaina bien facil de usar comparado a XML en AJAX. La lista de lenguajes soportados incluye ActionScript, C, C#, ColdFusion, Common Lisp, Delphi, E, Eiffel, Java, JavaScript, ML, Objective CAML, Perl, PHP, Python, Rebol, Ruby, y Lua.

descargalo aki

Java:

• org.json.
• org.json.me.
• Json-lib.
• JSON Tools.
• json-simple.
• Stringtree.
• SOJO.
• VRaptor.
• Restlet.
• Jettison.
• json-taglib.
• FLEXJSON.
• XStream.
• JsonMarshaller.
• Flexjson.
• Jackson JSON Processor.
• JON tools.
• google-gson.