View Full Version : [2.0b1][CLOSED] Ext.form.DateField setDisabled problem

28 Oct 2007, 8:03 PM
I am always cautious when suggesting that there might be a bug when it could be intended behaviour but here goes :)

The Ext.form.DateField inherits the setDisabled method from Component. It does set the textfield part of the datepicker to disabled but the little calendar trigger still works and when a value is selected from it the value of the textfield part changes.

The datefield should be completely disabled.

also it would be great if there was a setEditable method like in Ext.form.ComboBox which I guess would disable the trigger and therefore stop the problem altogether.

28 Oct 2007, 9:19 PM
i'm not too sure which version you're using, but this has already been resolved in the official Ext 1.1.1 build... :-?

i.e. setDisabled() disables both the text input field and the date picker icon.

28 Oct 2007, 9:35 PM
Using Ext 2.0

28 Oct 2007, 10:21 PM
dude, check the forum title. it says "Ext Community Forums (1.x) > Bugs" ;)

p.s. i've looked at the source for 2.0 and it's supposed to be doing the same thing.
could you post the test code you used? thanks.

28 Oct 2007, 11:09 PM
fair call I do this more that I am prepared to admit

I'll put together something for you tommorrow

29 Oct 2007, 12:40 PM
In a overridden Ext.Panel "constructor" function

// Australian dates are day month year
this.dob = new Ext.form.DateField({format: 'd-M-y',altFormats:'d/M/y|d-M-y|d-M|d', fieldLabel: 'Date Of Birth', readOnly: true, name: 'Person.DateOfBirth', width: 120 });

fired by the store on load event

, onRecordLoaded: function(store, records, options){

// data source stores date as ISO
var bd = new Date();

Now for the bit I complain about

// loads of other fields get "locked" here
// its a toggle state function
, lockPanel: function(locked){

this.setReadOnly(this.dob, locked);
, setReadOnly: function(f, bReadOnly){
if (f.isFormField)
f.getEl().dom.readOnly = bReadOnly;

// TriggerFields need to have the "trigger" button disabled
if (f instanceof Ext.form.TriggerField)
f.hideTrigger = !bReadOnly;

if (f instanceof Ext.form.ComboBox) {
//Alternatively, to check if combobox use: if (f.setEditable)...
else {

The trigger doesn't disable hope this gives you a clearer idea of what I am trying to achieve

29 Oct 2007, 12:43 PM
I guess what I really want is for every editable form component to have a setEditable(true|false) method. as you can see I have to poke around with the dom and do some hacky stuff to get the effect I need.

30 Oct 2007, 12:18 PM
setEditable is method valid only for ComboBox and it is used for allowing/disallowing typing directly in the input part of the combo. setDisabled is for all field types and it disables also triggers for both combo and date fields.

31 Oct 2007, 1:14 AM
setDisabled is for all field types and it disables also triggers for both combo and date fields

but setDisabled isn't disabling the trigger on the DateField.

31 Oct 2007, 3:16 AM
but setDisabled isn't disabling the trigger on the DateField.

:-/ :-/ :-/

setDisabled() works for me (i.e. the DateField's trigger is disabled)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<title>Test Ext.form.DateField</title>

<!-- USING Ext 2.0b1a -->
<link rel='stylesheet' href='ext-all.css'>
<script src='ext-base.js'></script>
<script src='ext-all-debug.js'></script>
Ext.onReady(function() {
var c = new Ext.form.ComboBox({
transform: 'myselect'

var d = new Ext.form.DateField({
id: 'mydate',
applyTo: 'mydate',
format: 'd/m/Y'

Ext.get('disable').on('click', function() {
<select id='myselect'/>
<option value='1'>one</option>
<option value='2'>two</option>
<input type='button' id='disable' value='Disable combo &amp; date field'/>

31 Oct 2007, 8:25 AM
but setDisabled isn't disabling the trigger on the DateField.

I have tested it with the latest 2.0 svn and it works flawlessly.

31 Oct 2007, 11:52 AM
ok i'll take another look at it i'm obviously doing something wrong. Thanks guys