PDA

View Full Version : Date format on submit



Progeny
14 Sep 2008, 3:57 AM
Hi, I have a datefield in my form panel. I want to format the date in order to pass the mysql format to my php submit page. I'd like to not change the current format displayed for my datefield.

Here's the code:


Ext.onReady(function() {

Ext.QuickTips.init();

var formPlan = new Ext.FormPanel({
labelWidth: 75,
frame: true,
title: 'New Plan',
waitMsgTarget: true,
monitorValid: true,
width: 350,
defaults: {
width: 210,
msgTarget: 'side',
},
defaultType: 'textfield',

items :[{
fieldLabel: 'Name',
name: 'name',
allowBlank: false
}, new Ext.form.DateField({
fieldLabel: 'Start',
name: 'date_start',
format: 'F j, Y',
allowBlank: false
}), new Ext.form.DateField({
fieldLabel: 'End',
name: 'date_end',
format: 'F j, Y',
allowBlank: false
}), new Ext.form.TextArea({
fieldLabel: 'Description',
name: 'description',
allowBlank: true
})
],

buttons: [{
text: 'New',
formBind: true,
handler: function() {
formPlan.form.submit({
url: 'ajax/plan.php',
method: 'POST',
params: {action: 'new'},
waitMsg:'Saving Data...',
success: function (form, action) {
Ext.MessageBox.alert('Message', 'Plan saved.');
},
failure: function(form, action) {
Ext.MessageBox.alert('Message', 'Save failed');
}
});
}
},{
text: 'Cancel',
handler: function() {
formPlan.form.reset();
}
}]
});

formPlan.render('plan');
});

dlbjr
14 Sep 2008, 6:11 AM
Add the following function to your project


function getDateValue(obj,format) {
var strReturn = '';
try {
strReturn = obj.getValue().format(format).trim();
}
catch (err) {
strReturn = '';
}
return strReturn;
}


Give your date fields and id value.


new Ext.form.DateField({
id: 'date_start',
fieldLabel: 'Start',
name: 'date_start',
format: 'F j, Y',
allowBlank: false



Then in the parameters of the form submit code add a parameter as such



formPlan.form.submit({
url: 'ajax/plan.php',
method: 'POST',
params: { action: 'new',
date_value1: getDateValue(Ext.get('date_start'),'Ymd')
},
waitMsg: 'Saving Data...',
success: function(form, action) {
Ext.MessageBox.alert('Message', 'Plan saved.');
},
failure: function(form, action) {
Ext.MessageBox.alert('Message', 'Save failed');
}
});


This allows me to set the dates dynamically to what ever I want

Progeny
14 Sep 2008, 11:17 AM
nice! thank you!

mjlecomte
14 Sep 2008, 4:37 PM
P.S. Watch your trailing comma.