PDA

View Full Version : [INFOREQ] About datecolumn



Neopulse
25 Nov 2013, 3:25 PM
I have been stuck for a couple of weeks in this, my grid doesn't show dates in firefox, but itīs show as I want in chrome.

I have read about 20 post about the issue and try every single advice but nothing, did anyone can explain the best way to store, retrieve dates from a mysql database and show in a grid. I have try everything since say the datatype in the model, the same in the datetype of the column, and noting.
check this please


Ext.define('ControLab.model.modVisita', {
extend: 'Ext.data.Model',


fields: [
{
name: 'entrada',
type: 'date',
dateformat: 'Y-m-d H:i:s',
},
......
}

later the grid


Ext.define('ControLab.view.gridVisita', {
extend: 'Ext.grid.Panel',
alias: 'widget.gridVisita',
store: 'storeVisita',
....
columns: [
{
xtype: 'datecolumn',
dataIndex: 'entrada',
text: 'Entrada',
//renderer: Ext.util.Format.dateRenderer('d/m/Y h:i'),
//format: 'd/m/Y H:i:s',
dateformat: 'Y-m-d H:i:s',
//submitFormat:'U',
width: 200,
allowBlank:false,
},
...
]
}

evant
25 Nov 2013, 3:28 PM
What does your server send back?

Neopulse
26 Nov 2013, 3:58 PM
The server send back


{"success":true,"total":3,"visitas":[{"idvisita":"239","idusuario":"116","ci":"12345678908","entrada":"2013-11-25 17:30:46","salida":"0000-00-00 00:00:00","nombre":"\u00e1\u00e1\u00e1\u00e1\u00e1\u00e1\u00e1\u00e1a\u00e1\u00e1\u00b4\u00f1\u00f1\u00f1","pcname":"PC-1","idoperador":"5","visitNotas":"","idpc":"1"},{"idvisita":"249","idusuario":"112","ci":"3.534543534","entrada":"2013-11-25 10:19:27","salida":"0000-00-00 00:00:00","nombre":"\u00e1\u00e1\u00e1\u00e1\u00e1\u00e1\u00e1a\u00e9\u00e9e\u00b4\u00b4e\u00e9\u00e9\u00e9\u00e9","pcname":"PC-2","idoperador":"5","visitNotas":"","idpc":"2"},{"idvisita":"250","idusuario":"113","ci":"22323423423","entrada":"2013-11-25 10:19:45","salida":"0000-00-00 00:00:00","nombre":"dfgdfgdfgdfgdfgdfgdfg","pcname":"PC-3","idoperador":"5","visitNotas":"","idpc":"5"}]}


The dates are in "Y-m-d H:i:s" format as you can see


2013-11-25 17:30:46

scottmartin
27 Nov 2013, 12:40 PM
Are you seeing a bunch of NaN in FF?

47031

Neopulse
27 Nov 2013, 1:36 PM
Firefox show the column empty, at first it show that NAN/NaN/0NaN
just like
http://www.sencha.com/forum/attachment.php?attachmentid=46775&d=1383939106

But after digging in the forum and the extens API I set the appropriated (I thought) config


Ext.define('ControLab.model.modVisita', {
extend: 'Ext.data.Model',
fields: [
{
name: 'entrada',
type: 'date',
dateformat: 'Y-m-d H:i:s',
},
//more fields
]
});



And then those NAN/NaN/0NaN disappear but the grid show nothing as you can see here
47032

The weird thing here is the fact that Chrome v25.0 (not the last) show the dates as I like
47033

even I can change the date format

renderer: Ext.util.Format.dateRenderer('d M Y - h:i a'),


and show a different format (but unfortunately in chrome only) like you can see
47034
Any ideas please??
Excuse my English please

scottmartin
27 Nov 2013, 1:50 PM
yes, it will show blank if you use date instead of datetime
{ name: 'stamp', type: 'datetime', dateFormat : 'Y-m-d H:i:s' }

But it then shows the NaN .. I suspect this is a parsing bug with FF (same type of report for charting a while back)

Neopulse
27 Nov 2013, 2:00 PM
I even try a different approach (it was my last shot). I made a modification in my SQL query to ensure to get the appropriated format, look the red letter


try {
$v_consulta = $db_conn->query('SELECT
`visitas`.id AS idvisita, `visitas`.`idusuario`,`usuarios`.`ci`, DATE_FORMAT(`visitas`.entrada,"%Y-%m-%d %H:%i:%s") AS entrada, `visitas`.salida,
`usuarios`.`nombre`,`pc`.`nombre` AS pcname,
`visitas`.operador AS idoperador, `visitas`.notas as visitNotas, `visitas`.idpc
FROM visitas
LEFT JOIN `controlab`.`usuarios` ON `visitas`.`idusuario` = `usuarios`.`id`
LEFT JOIN `controlab`.`pc` ON `visitas`.`idpc` = `pc`.`id`
WHERE `visitas`.`salida` = "0000-00-00 00:00:00"
ORDER BY `visitas`.`idpc`
');


Then I delete any other custom component


/*{ xtype: 'buttoncolumn',
width: 120,
text: 'Acciones',
...
}*/



and



/*editor: {
xtype: 'datetimefield',
format: 'd/m/Y',
submitFormat:'U',
listeners:{
focus:function(me, evt){
var valor = new Date(me.up().startValue);
me.setValue(valor);
}
},
},*/


and



<!-- <script src="resources/js/ButtonColumn.js"></script>
<script type="text/javascript" src="resources/js/UX_TimePickerField.js"></script>
<script type="text/javascript" src="resources/js/UX_DateTimePicker.js"></script>
<script type="text/javascript" src="resources/js/UX_DateTimeField.js"></script>
<script type="text/javascript" src="resources/js/UX_DateTimeMenu.js"></script>-->


I thought "may be one of theses components, overwrite the date parse mechanism of the extens core" that make FF get lost and Chrome get unaffected for some reason, but.... nothing.

Iīm really lost here

scottmartin
28 Nov 2013, 6:03 PM
Thanks for the report! I have opened a bug in our bug tracker.

evant
28 Nov 2013, 6:24 PM
This isn't a bug.

Your date format is:



Y-m-d H:i:s


Your date is:



2013-02-20 07:03


You're not sending back any seconds. Modify the format so it matches what your server is sending.

scottmartin
28 Nov 2013, 6:57 PM
Errr, Evan is correct, .. I guess I pulled 'datetime' type out of my ...

See if this will work for you, tested fine in FF

1sk

mankz
28 Nov 2013, 11:39 PM
And also, in the original post it's "dateformat" not "dateFormat" :)

Neopulse
29 Nov 2013, 10:47 AM
The solution..... easy, I just remove xtype of the column, I mean
before


{
xtype: 'datecolumn',
dataIndex: 'entrada',
text: 'Entrada',
submitFormat:'U',
width: 200,
lockable: false,
allowBlank:false,
},...


And now


{
//xtype: 'datecolumn',
dataIndex: 'entrada',
text: 'Entrada',
submitFormat:'U',
width: 200,
lockable: false,
allowBlank:false,
},...


How easy isn't it, even setting "xtype: 'gridcolumn', make it work in FF. The curious of those things is that chrome works in the same way in every situation but FF get lost. Now the render format are still lost in FF.


renderer: Ext.util.Format.dateRenderer('d/m/Y h:i:s'),

This work ok in chrome (as usual) but FF show those NaN

How I solve it, I re-parse the date


{
xtype: 'gridcolumn',
dataIndex: 'entrada',
text: 'Entrada',
renderer: render_date,
}

....

function render_date(val) {
val = Ext.Date.parse(val,"c")
val = Ext.util.Format.date(val, 'd/m/Y H:i a');
return val;
}


Or simple in one line


function render_date(val) {
return Ext.util.Format.date(Ext.Date.parse(val,"c"), 'd/m/Y H:i a');
}


I was able to reproduce the error in a simple application I make just for test proposes, but not in the fiddle.
I try the fiddle example in may own PC and works ok, but after replace the store proxy json to an proxy json api through php files, that read from a MySQL server the issue appear again.

I things is about the way xtensjs parse the dates that come from from the php file, I don't know if i make myself clear.

evant
29 Nov 2013, 2:50 PM
The problem was that your server was returning the data:



// Y-m-d H:i
2013-02-20 07:03


You were saying the format was:


Y-m-d H:i:s


You need to fix up the format in your model (dateFormat) so it can parse from the server correctly.

Neopulse
3 Dec 2013, 11:05 AM
As I toll you I solve it, itīs not longer a trouble for my app, but I still think there is a bug parsing dates from MySQL servers. Take a look to the picture
47091

The generated json show the date in "Y-m-d H:i:s" format note the 40 seconds in the field "entrada", As I told you I reparse the date and give format throw the ext.util library, and show ok in FF.



return Ext.util.Format.date(Ext.Date.parse(val,"c"), 'd/m/Y H:i a');

evant
3 Dec 2013, 5:56 PM
If you can create a fiddle to reproduce it, please go ahead.

As you can see in the correct fiddle, it works without issue once:

1) The type of the field is set appropriately
2) The data is corrected to match the format

https://fiddle.sencha.com/#fiddle/1sk

Neopulse
4 Dec 2013, 8:56 AM
I try to reproduce the issue in the fiddle but I couldn't, but in my XAMPP server running over windows 7 I can reproduced, may be the issue come because I use in my app


Ext.USE_NATIVE_JSON = true;


This article talk about the native json
I try the fiddle example in my own pc and set Ext.USE_NATIVE_JSON = true; and it show empty columns in all fields.

Even I run a virtual machine with "Debian GNU/Linux wheezy/sid" and still show nothing, Im not longer follow this sorry.