Unable to set checkbox state in change event

[[email protected]]

Hi All,
I am trying to set the checkbox state value in Change event.
We have client side business rules where on particular condition I can perform some action. it used to work perfectly fine until we upgraded from 5.1.3 to 6.5.2
I can easily reproduce my issue with the below code snippet

behavior on version 5.1.3.228 : The checkbox doesn't get checked, which is expected
behavior on version 6.5.2.463 : The checkbox gets checked and after that you can't unchecked it.

Ext.application({
name : 'Fiddle',
launch : function() {
Ext.create('Ext.form.Panel', {
bodyPadding: 10,
width: 300,
title: 'Checkbox Title',
items: [
{
xtype: 'fieldcontainer',
fieldLabel: 'This is Checkbox',
defaultType: 'checkbox',
items: [
{
boxLabel : 'Check me',
name : 'checkbox',
listeners : {
change : function (){
this.setValue(true)
}
}
}
]
}
],
renderTo: Ext.getBody()
});
}
});

[mitchellsimoens]

The checkbox gets checked and after that you can't unchecked it.

Just reading your code snippet, when the checkbox value changes, you are setting it to true/checked so I wouldn't expect the checkbox to visually ever be unchecked (other than initially).

[[email protected]]

My apologies, I want to set False in the event.

[praveensaini23]

You can make your change listener to use Ext.defer, so it will not disturb the change event post processing, what it will do is once checkbox will complete its processing of checking the checkbox dom, that setValue code will run and make the checkbox unchecked. Below is sample code -

listeners: {
change: function () {
Ext.defer(this.setValue, 1, this, [false]);
}
}

[mitchellsimoens]

If you are just gonna delay it... could just use the delay event option:

listeners: {
    delay: 1,
    change: function () {
        this.setValue(false)
    }
}