[SOLUCIONADO] formato column en gridpanel
Buenas, una vez mas aqui molestando y tratando de obtener una solución llevo días buscando la solucion al siguiente problema, lo que ocurre es que muestro una columna en un grid que es del tipo date, esto es devuelto en un json con el siguiente formato :
{"record_count":29,"data":[{"responsable":"","qtip1":"","usuario":"","tiporeclamo":"","causa":"","nombre":"NESTLÉ COLOMBIA","id":3,"observacion":"","contacto":"PAULA RUIZ","emailcc":"","producto":"extracto","lista1":0,"fecha":"2007-09-04 00:00:00.0","fechagroup":"04/09/2007",
Si bien la columna que presenta el problema es la que contiene el campo fecha, en firefox funciona bien, en cambio en ie muestra NaN/NaN/NaN, el columnmodel esta definido de la sgte manera
header : 'Fecha',
sortable : true,
align : 'right',
dataIndex : 'fechaesp',
id : 'colfecha',
renderer : Ext.util.Format.dateRenderer('d/m/Y'),
width : 110
y el store como sigue, ..
this.storeConsultaRegistroReclamos = new Ext.data.GroupingStore({
autoDestroy: true,
autoLoad : false,
proxy : new Ext.data.HttpProxy({
url : '../ConsultaReclamosRegistrados.do',
method : 'POST'
}),
// reader : new Ext.data.JsonReader(),
reader :new Ext.data.JsonReader({
root :'rows',
fields : [
{
name : 'action2',
type : 'string'
},
{
name : 'fechaesp',
mapping : 'fechaesp',
type : 'date',
dateFormat : 'd/m/Y'
}
]
}),
sortInfo : {
field : 'fechaesp',
direction : "ASC"
},
groupField : 'nombre'
});
Si me pudieran ayudar, desde ya gracias...
Gracias a todos, especialmente a ti Lgonzales, por la dedicación y el tiempo para resolverme el problema y claro era el tipo de dato que venia en el json, ya que tenia java.sql.date y era date, junto con lo demás en el script
Sabes, le saco el metadata y deja de funcionar, ahora si utilizo fechaesp, este viene asi fechaesp":"2010-12-14"....te agregue, gracias
Ok ni modo, cambia la parte de fechaesp de tal manera que quede asi:
field = new JSONObject();
field.put("name", "fechaesp");
field.put("type", "date");
field.put("dateFormat", "Y-m-d");
fields.put(field);
metadata.put("fields", fields);
el reader que quede asi:
fields : [
{
name : 'fechaesp',
type : 'date',
dateFormat : 'Y-m-d'
},
y en el colmunmodel :
{
header : 'Fecha',
xtype: 'datecolumn',
sortable : true,
align : 'right',
renderer : Ext.util.Format.dateRenderer('d/m/Y'), //podrias poner esto
format: 'd/m/Y',// o esto, ya es eleccion tuya
dataIndex : 'fechaesp'
},
cualquier cosa avisas.
ok mira puedes olvidarte del metadata, sacalo no lo arrojes en el json y formatea la fecha para que no salga con el decimal.
segun veo en tu reader tu root es rows y en tu json es data, otro que veo es que tu estas poniendo "metaData": si bien ya estas especificando todo en el reader para que poner esto y ahi mismo hace que se repita root: data
seria mejor segun la estructura que estas haciendo en tu grid que el json arroje nada mas los registros que se soliciten.
Ahora en el grid tu llamas a "fechaesp" el cual no existe en el json, en el json existe:
fecha":"2010-12-14 12:54:14.0"
"fechagroup":"14/12/2010"
en el record como te das cuenta no hay "fechaesp", este solo lo tienes en metaData, pero no existe en el registro.
Otro que estas recibiendo la fecha con decimales
<< fecha":"2010-12-14 12:54:14.0" >> y lo mejor seria que lo recibieras sin el decimal << fecha":"2010-12-14 12:54:14" >>, dando un ejemplo rapido.
Asi podria quedar tu json
{"record_count":2,"data":[{"responsable":"","qtip1":"","usuario":"","tiporeclamo":"","causa":"","nombre":"JAVA","id":103,"observacion":"EL PRODUCO SE ENCUENTRA BLOQUEADO. SE REQUIERE RECOMENDACIÓN DE ACCIÓN DE INMEDIATO.\r\nINFORME TÉCNICO Y FOTOS EN DISCO O:","contacto":"MELISSA QUESADA","emailcc":"","producto":"HARINAS","lista1":0,"fecha":"2010-12-14 12:54:14","fechagroup":"14/12/2010","listadistribucion3":0,"listadistribucion2":0,"respuesta":"","accion":"","nsatisfaccion":"","criticidad":"","fechaesp":"2010-12-14","hora":"12:54","motivo":"PRESENCIA DE GORGOJOS Y LARVAS EN EL EXTERIOR DE 58 SACOS DE HARINA DE CEBADA, 1.160KG. LOTE MN BC.","archivo":"","email":"MQUESADA@JAVARMA.COM","planta":"0","action2":"icon-edita","action1":"","origen":""},{"responsable":"","qtip1":"","usuario":"","tiporeclamo":"","causa":"","nombre":"NESTLÉ CHILE","id":104,"observacion":"SE PROCEDE A RETRASAR LA ENTREGA 1 SEMANA PARA QUE SE FUMIGUE.","contacto":"NATALIA BASERGA","emailcc":"","producto":"HARINAS","lista1":0,"fecha":"2010-12-27 08:43:41","fechagroup":"27/12/2010","listadistribucion3":0,"listadistribucion2":0,"respuesta":"","accion":"","nsatisfaccion":"","criticidad":"","fechaesp":"2010-12-27","hora":"08:43","motivo":"NO SE PUDO DESPACHAR A TIEMPO EL PEDIDO N°4534505924 AL CLIENTE NESTLÉ CHILE POR PRESENCIA DE GORGOJOS EN EL EXTERIOR DE LOS BIG BAGS.","archivo":"","email":"NBASERGA@MALTEXCO.COM","planta":"0","action2":"icon-edita","action1":"","origen":""}]}
Fijate que ya no requiero metaData y la fecha sale sin los decimales.
y asi podria que dar tu store
this.storeConsultaRegistroReclamos = new Ext.data.GroupingStore({
autoDestroy: true,
autoLoad : false,
proxy : new Ext.data.HttpProxy({
url : '../ConsultaReclamosRegistrados.do',
method : 'POST'
}),
reader :new Ext.data.JsonReader({
root :'data',
fields : [
{
name : 'fecha',
type : 'date',
dateFormat : 'Y-m-d H:m:i'
},
{
name : 'action2',
type : 'string'
}
]
}),
sortInfo : {
field : 'fechaesp',
direction : "ASC"
},
groupField : 'nombre'
});
mira que cambio el root y el formato del field y lo llamo fecha y no fechaesp
y asi podria quedar tu columnmodel
{
header : 'Fecha',
xtype: 'datecolumn',
sortable : true,
align : 'right',
renderer : Ext.util.Format.dateRenderer('d/m/Y'), //podrias poner esto
format: 'd/m/Y',// o esto, ya es eleccion tuya
dataIndex : 'fecha'
},
Espero que te sea util, cualquier cosa me avisas.
Se me habia olvidado en tu store cambia:
sortInfo : {
field : 'fechaesp',
direction : "ASC"
},
por
sortInfo : {
field : 'fecha',
direction : "ASC"
},
cambiale el fechaesp por fecha, y ya te ordenaria como debe de ser xD.
Gracias Lgonzales, pero si existe fechaesp, lo que pasa es que quizas no lo veas porque esta mas a la derecha, aun asi hago los cambios????
public String recuperaPaginaReclamos(int startvalue, int limitvalue) {
String paso = "";
try {
JSONArray listaJSON = new JSONArray();
int ultimo = startvalue + limitvalue;
if (ultimo > datosReclamos.size()) {
ultimo = datosReclamos.size();
}
List pasoList = datosReclamos.subList(0, datosReclamos.size());
int i = 1;
for (Reclamo reclamo : pasoList) {
JSONObject objectJSON = new JSONObject();
objectJSON.put("fecha", reclamo.getFecha());
objectJSON.put("fechaesp", reclamo.getFechaesp());
objectJSON.put("fechagroup", FormateaFecha.DevuelveFechaIII(reclamo.getFecha()));
listaJSON.put(objectJSON);
i++;
}
JSONObject jsonData = new JSONObject();
JSONArray fields = new JSONArray();
JSONObject metadata = new JSONObject();
metadata.put("cantidad", "cantidad");
//-------------------------------------------------
JSONObject field = new JSONObject();
field = new JSONObject();
field.put("name", "id");
field.put("type", "integer");
fields.put(field);
metadata.put("fields", fields);
//-------------------------------------------------
field = new JSONObject();
field.put("name", "fechaesp");
field.put("type", "java.sql.date");
fields.put(field);
metadata.put("fields", fields);
//-------------------------------------------------
field = new JSONObject();
field.put("name", "fecha");
field.put("type", "java.sql.date");
fields.put(field);
metadata.put("fields", fields);
//-------------------------------------------------
field = new JSONObject();
field.put("name", "fechagroup");
field.put("type", "string");
fields.put(field);
metadata.put("fields", fields);
//-------------------------------------------------
metadata.put("root", "data");
metadata.put("totalProperty", "record_count");
jsonData.put("metaData", metadata);
jsonData.put("record_count", datosReclamos.size());
jsonData.put("data", listaJSON);
paso = jsonData.toString();
} catch (Exception ex) {
log.error(ex.getMessage());
}
return paso;
}
Este es el servlet que genera el json, lo resumí por la cantidad de lineas, lo coloco por si aporta algún antecedente, ya que todo sigue sin funcionar...
Gracias Lgonzales, hice los cambios y sigue fallando al momento de mostrar en internet explorer, en firefox funciona bien....
Puedes poner como te viene el json en este momento para poder verlo, debido que ahasta donde se ve esta bien, pong json para poder verlo.
{"record_count":2,"data":[{"responsable":"","qtip1":"","usuario":"","tiporeclamo":"","causa":"","nombre":"JAVA","id":103,"observacion":"EL PRODUCO SE ENCUENTRA BLOQUEADO. SE REQUIERE RECOMENDACIÓN DE ACCIÓN DE INMEDIATO.\r\nINFORME TÉCNICO Y FOTOS EN DISCO O:","contacto":"MELISSA QUESADA","emailcc":"","producto":"HARINAS","lista1":0,"fecha":"2010-12-14 12:54:14.0","fechagroup":"14/12/2010","listadistribucion3":0,"listadistribucion2":0,"respuesta":"","accion":"","nsatisfaccion":"","criticidad":"","fechaesp":"2010-12-14","hora":"12:54","motivo":"PRESENCIA DE GORGOJOS Y LARVAS EN EL EXTERIOR DE 58 SACOS DE HARINA DE CEBADA, 1.160KG. LOTE MN BC.","archivo":"","email":"MQUESADA@JAVARMA.COM","planta":"0","action2":"icon-edita","action1":"","origen":""},{"responsable":"","qtip1":"","usuario":"","tiporeclamo":"","causa":"","nombre":"NESTLÉ CHILE","id":104,"observacion":"SE PROCEDE A RETRASAR LA ENTREGA 1 SEMANA PARA QUE SE FUMIGUE.","contacto":"NATALIA BASERGA","emailcc":"","producto":"HARINAS","lista1":0,"fecha":"2010-12-27 08:43:41.0","fechagroup":"27/12/2010","listadistribucion3":0,"listadistribucion2":0,"respuesta":"","accion":"","nsatisfaccion":"","criticidad":"","fechaesp":"2010-12-27","hora":"08:43","motivo":"NO SE PUDO DESPACHAR A TIEMPO EL PEDIDO N°4534505924 AL CLIENTE NESTLÉ CHILE POR PRESENCIA DE GORGOJOS EN EL EXTERIOR DE LOS BIG BAGS.","archivo":"","email":"NBASERGA@MALTEXCO.COM","planta":"0","action2":"icon-edita","action1":"","origen":""}],"metaData":{"totalProperty":"record_count","root":"data","cantidad":"cantidad","fields":[{"name":"id","type":"integer"},{"name":"nombre","type":"string"},{"name":"contacto","type":"string"},{"name":"emailcc","type":"string"},{"name":"planta","type":"integer"},{"name":"fechaesp","type":"java.sql.date"},{"name":"origen","type":"string"},{"name":"criticidad","type":"string"},{"name":"qtip1","type":"string"},{"name":"email","type":"string"},{"name":"motivo","type":"string"},{"name":"hora","type":"string"},{"name":"observacion","type":"string"},{"name":"archivo","type":"string"},{"name":"usuario","type":"string"},{"name":"producto","type":"string"},{"name":"fecha","type":"java.sql.date"},{"name":"fechagroup","type":"string"},{"name":"action1","type":"string"},{"name":"action2","type":"string"},{"name":"tiporeclamo","type":"string"},{"name":"responsable","type":"string"},{"name":"causa","type":"string"},{"name":"accion","type":"string"},{"name":"lista1","type":"integer"},{"name":"listadistribucion3","type":"integer"},{"name":"nsatisfaccion","type":"string"},{"name":"listadistribucion2","type":"integer"},{"name":"respuesta","type":"string"}]}}
Si te das cuenta ahí va el fechaesp, ahora claro podría mostrar fechagroup, y se soluciona el problema visual, pero no permite ordenar en la grilla, ya que lo ordena de manera alfabética y no de forma cronológica....de verdad espero me puedas ayudar...
Mirando el ultimo ejemplo que haz puesto puedes dejar tu columnmodel de la siguiente manera:
{
header : 'Fecha',
xtype: 'datecolumn',
sortable : true,
align : 'right',
dataIndex : 'fechaesp',
format: 'd-m-Y'
},
mira el xtype.
Gracias una vez mas, pero aun nada, esto sigue sin funcionar Tokkaido, te hice caso y lo deje así, en el json viene ahora
"fechaesp":"2007-09-04"
que ademas viene tipificado asi en el json,
{"name":"fechaesp","type":"java.sql.date"}
en el columnmodel lo deje asi....
{
header : 'Fecha',
sortable : true,
align : 'right',
dataIndex : 'fechaesp',
id : 'colfecha',
renderer : Ext.util.Format.dateRenderer('d/m/Y'),
//format : 'd/m/Y',
width : 110
},
y en el store como sigue...
this.storeConsultaRegistroReclamos = new Ext.data.GroupingStore({
autoDestroy: true,
autoLoad : false,
proxy : new Ext.data.HttpProxy({
url : '../ConsultaReclamosRegistrados.do',
method : 'POST'
}),
reader :new Ext.data.JsonReader({
root :'rows',
fields : [
{
name : 'fechaesp',
type : 'date',
dateFormat : 'Y-m-d'
},
{
name : 'action2',
type : 'string'
}
]
}),
sortInfo : {
field : 'fechaesp',
direction : "ASC"
},
groupField : 'nombre'
});
pero nada de nada, osea ahora volvió a verse bien en firefox, pero en ie aparece como NaN/NaN/NaN
el problema que veo que tienes es que regresas una fecha con decimales en los segundos y no he podido encontrar como se configura el formato con decimales, pero si tu JSON lo devuelves asi "fecha": "2007-09-04 00:00:00" en vez de asi: "fecha": "2007-09-04 00:00:00.0" y configuras tu store con :
{
name:'fecha',
type: 'date',
dateFormat: 'Y-m-d H:i:s'
}
y tu grid asi:
renderer: Ext.util.Format.dateRenderer('d/m/Y H:i:s')
no deberías tener problemas. En realidad necesitas controlar los milisegundos?
hola, no sé si lo que te devuelve el JSON es correcto, según tu código no devuelves ningún campo llamado "fechaesp", además devuelves la fecha en 2 formatos : "Y-m-d" y "d/m/Y", no sé si los datos los estas leyendo de una base de datos MySQL, pero de ser asi devuelve todos con el formato normal y luego lo cambias al presentarlo, es decir en tu jsonreader el dateFormat debería ser "Y-m-d" y luego en el rendered haces el "d/m/Y"
espero te sea util
Gracias Tokkkaido, aunque si tienes razon es fecha y no fechaesp, y como veras en el json viene Y-m-d hh:mm:ss, aun asi hago el dateformat como Y-m-d???
Tokkaido, mira lo corregi y cambie fechaesp por fecha, en el dateformat probe con Y-m.d h:m:s y con Y-m-d y quedando la columna como sigue
{
header : 'Fecha',
sortable : true,
align : 'right',
dataIndex : 'fecha',
id : 'colfecha',
renderer : Ext.util.Format.dateRenderer('d/m/Y'),
width : 110
},
ahora claro tube un avance de esta forma, ya que asi tanto en firefox como en ie se ven mal, es decir, NaN/NaN/NaN,
ahora si que no entiendo nada...
Mira, te dejo un tutorial donde se explica lo referente a las fechas:
http://www.quizzpot.com/2009/07/utilizando-fechas-y-tiempo-en-un-grid/
Espero te sirva.
Saludos
Le agradezco a ambos la preocupación pero nada funciona aun, Crysfel vi tu link de hecho lo vi antes de comenzar mis preguntas
{"responsable":"","qtip1":"","usuario":"","tiporeclamo":"","causa":"","nombre":"NESTLÉ COLOMBIA","id":3,"observacion":"","contacto":"PAULA RUIZ","emailcc":"","producto":"extracto","lista1":0,"fecha":"2007-09-04 00:00:00.0","fechagroup":"04/09/2007","listadistribucion3":0,"listadistribucion2":0,"respuesta":"La presencia de moho se puede atribuir a una limpieza defectuosa del exterior de la superficie de los tambores. Se estimó que el producto se puede utilizar sin problemas, sugiriendo una limpieza previa de la superficie exterior.","accion":"El departamento de Control de Calidad realiza análisis determinando que cumple con los parámetros microbiológicos de calidad solicitados por especificación.","nsatisfaccion":"","criticidad":"","fechaesp":"04/09/2007","hora":"12:00","motivo":"SE ENCONTRARON TAMBORES DE LOTES 07-6996 Y 07.630 CON MOHO EN LA PARTE SUPERIOR BORDEANDO LA TAPA DE SEGURIDAD DE LOS TAMBORES. DANDO UN ASPECTO MUY DESAGRADABLE Y ANTIHIGIÉNICO Y POSIBLE CONTAMINACIÓN CRUZADA DE LA MATERIA PRIMA. SE ENCONTRÓ UN TAMBOR DEL LOTE 07-696 SIN LA TAPA DE SEGURIDAD \"VERDE\" DENTRO DEL CONTENEDOR.","archivo":"","email":"PAULA.RUIZ@CO.NESTLE.COM","planta":"0","action2":"icon-edita","action1":"","origen":""}
De hecho si miras el tag fecha y el formato que viene ya no se que colocar en el store, que esta definido de la siguiente manera
this.storeConsultaRegistroReclamos = new Ext.data.GroupingStore({
autoDestroy: true,
autoLoad : false,
proxy : new Ext.data.HttpProxy({
url : '../ConsultaReclamosRegistrados.do',
method : 'POST'
}),
reader :new Ext.data.JsonReader({
root :'rows',
fields : [
{
name : 'fecha',
type : 'date',
dateFormat : 'c'
},
{
name : 'action2',
type : 'string'
}
]
}),
sortInfo : {
field : 'fecha',
direction : "ASC"
},
groupField : 'nombre'
});
Ojo que la c en el dateFormat ya fue mi ultima opcion antes coloque 'Y-m-d','Y-m-d H:m:s.s', etc., y nada y mi columna esta de la sgte.
forma :
{
header : 'Fecha',
sortable : true,
align : 'right',
dataIndex : 'fecha',
id : 'colfecha',
renderer : Ext.util.Format.dateRenderer('d/m/Y'),
width : 110
},
como dije anteriormente lo bueno dentro de todo es que ahora se ve mal en firefox e internet explorer, ahora claro si saco el renderer me muestra de la misma forma que esta en el json,...por favor necesito su ayuda esto me esta volviendo loco....gracias
¿Conoces a alguien que pueda responder esta pregunta? Comparte el link en Twitter o Facebook
Es necesario registrarse para poder participar en el foro! Si ya tienes una cuenta puedes entrar y comentar en este foro.