Display a year from calendar in ExtJS 4 - extjs4

I'm using a calendar in ExtJS 4, and I want my field to display only a year.
Currently, when I use a calendar it displays in my field this kind of date: "08/20/2013".
I'm using this code:
{
xtype: 'datefield',
fieldLabel: 'test',
id: 'yearOfExecution',
dateFormat: 'd/m/y',
anchor:'20%',
displayField: 'label',
valueField: 'value'
}
As I said, I only want to display a year (from my previous example, it should display "2013").
Should I modify this line?
displayField: 'label'

Try changing date format to 'y'. This should be in the (thorough) Sencha API.

Related

Row Editor sending wrong Date

Recently I have upgrade my Ext version from 4.0.7 to 4.1.1
In my model I have defined like
{name : 'StartDate',type: 'date' ,dateFormat: 'time'},
My Grid Column is
{
id: 'StartDateID',
width: 180,
text: 'Start Date',
dataIndex: 'StartDate',
renderer : Ext.util.Format.dateRenderer('m/d/Y'),
editor:{
allowBlank: true,
xtype:'datefield',
format:'m/d/Y',
editable: true},
sortable: false, groupable: false }
On Edit I am doing
My_Grid.on('edit', function(editor, e) {
e.store.sync();
}
After clicking on Update I used to get [with Ext 4.0.7 ] date value as
2012-08-04T00:00:00
but after upgrade with 4.1.1 I am getting date value as
310008e
Which I am not understanding.
My date is in this format
1346351400000
Can you please suggest me what is missing here? Or else how to get proper date after clicking update button from RowEditor.
Your model definition is incorrect, if you want your desired format it should be like:
{name : 'StartDate',type: 'date' ,dateFormat: 'U'},
'time' is not in the documentation, the only reason you could actually be using 'time' is if it is a custom type you have created, which is probably not the case.

date format with extjs 4 not rendering in date picker

I have the following date picker
{
xtype: 'datefield',
id: 'FinalDespatchDate',
name: 'FinalDespatchDate',
fieldLabel: 'Part Despatch Date',
labelWidth: 150,
width: 370,
validateOnChange: false,
format: 'd/m/Y'
},
In my model i have
{
mapping:'FinalDespatchDate',
name:'FinalDespatchDate',
type: 'date',
dateFormat:'d/m/Y'
},
if in my model i don't include the dateFormat. The date binds to my date picker but it sends the date in an incorrect format. When i add dateFormat it sends the date in the correct format it just no longer binds to the datepicker. ie the above configuration display nothing in the date picker
Does your data come from server with properly formatted date value ('d/m/Y') in this (non-working) configuration?

date format with extjs 4.1 issue

In my model (Ext.data.Model) i have the following property
{
mapping:'Created',
name:'Created',
type: 'date',
format:'d/m/Y'
},
On my form i have the following field
{
xtype:'datefield',
name:'Created',
fieldLabel:' Date',
format:'d/m/Y',
width: 350
},
If i select the following date in the picker "01/04/2012" ( i'm in the UK, 1st April 2012)
I get the following in firebug json post "2012-01-04T00:00:00" ( 4th Jan 2012 )
How can i ensure the correct regions are coming through
In your model you define Ext.data.Field.
Have a look in the API docs, Ext.data.Field has no configuration called format, but dateFormat.
Try this
{
name:'Created',
type: 'date',
dateFormat:'d/m/Y'
},
and you just need mapping, if your data from the backend has a different name as you want to use in the model.
BTW: since ExtJS 4.1.3 there also are two new config items: dateReadFormat and dateWriteFormat to define different format for the reader and the writer. But if you define dateFormat this will be the same for both.
on the form field you need the extra property submitFormat:
{
xtype:'datefield',
name:'Created',
fieldLabel:' Date',
format:'d/m/Y',
width: 350,
submitFormat: 'd/m/Y'
}

Loading date/time into Sencha Touch Model

I'm using Sencha Touch 1.1. I have the following model and store:
Ext.regModel(TrafficResponse.Models.IncidentReports, {
idProperty: 'Id',
fields: [
{name: 'Id', type: 'int'},
{name: 'TMCRequestedTime', type: 'date'},
{name: 'TRUDetectedTime', type: 'date'},
{name: 'SiteArrivalTime', type: 'date'},
{name: 'SiteDepartedTime', type: 'date'}
],
proxy: {
type: 'localstorage',
id: TrafficResponse.Stores.IncidentReports
},
writer: {
type: 'json'
}
});
truApp.stores.incidentReportStore = new Ext.data.Store({
model: TrafficResponse.Models.IncidentReports,
id: TrafficResponse.Stores.IncidentReports,
autoLoad: true
});
I set the date value using a date/time picker (not a standard Sencha control) and use the updateRecord method of the form to update the model with the values on the form.
After sync() has been done the record in localstorage has the date value in the following format:
2012-02-09T22:15:00.000Z
The value on the date/time picker is Friday, February 10 2012 08:15 so it appears as though the GMT value is being stored.
After refreshing the browser and loading the model from localstorage, the value in localstorage is retained as above but it is not loaded into the model. The value in the model is null.
If I change the model and add dateFormat: 'c' to the field configuration, the date is loaded into the model with the following value:
Thu Feb 09 2012 22:15:00 GMT+1000 (E. Australia Standard Time)
The date is displayed on the form with that value as well which is 10 hours before the date that was set originally.
What can I do to get the date to load correctly and retain the timezone?
After a lot of stepping though code I discovered that the issue was caused by date-js. I removed date-js and used Sencha Date functions and everything now works correctly.

Initially selected value from store in dijit.form.FilteringSelect

I have a dojo.data.ItemFileReadStore as follows:
var partyStore = new dojo.data.ItemFileReadStore({
id: 'partyStore',
data: {
label:'name',
items:[
{value:'APPLES', name:['Apples']},
{value:'ORANGES', name:['ORANGES']},
{value:'PEARS', name:['PEARS']}
]}
});
and a dijit.form.FilteringSelect as:
var partyList = new dijit.form.FilteringSelect({
id: "partyLookup",
name: 'partyLookup',
store: partyStore,
searchAttr: "name"}, infoDiv);
How can I make the initially selected value be Oranges?
I have tried various entries for the value in the FilteringSelect so have left it out in this example.
Your data store doesn't seem right. Try changing it to:
var partyStore = new dojo.data.ItemFileReadStore({
identifier: 'value',
items:[
{value:'APPLES', name:'Apples'},
{value:'ORANGES', name:'ORANGES'},
{value:'PEARS', name:'PEARS'}
]
});
You can then set the value of the dijit.
partyList.set('value', 'ORANGES');
I had missed off the "identifier" from the store data. It seems without the identifier being set it indexes them ie. 0,1,2,3,4...
Once I set:
identifier: 'value'
the current value of the FilteringSelect comes back as the 'value' form the data.
Sorry to answer my own question, thanks to anyone who helped or took a look.