Tri-state checkbox for ExtJs 3.0

[Mr.Gray]

The code is base on great work of Condor and other developers who posted at http://www.extjs.com/forum/showthread.php?28096-2.x-Tri-state-checkbox-and-themed-checkbox-and-radio&highlight=tricheckbox

20258

[wm003]

Thank you! :)

[waky]

Thanks!

[xavxav]

Thanks a lot !

Is it possible to trigger any action when the user clicks on one tri-state checkbox ?

Regards,
Xavier

[xavxav]

Is it possible like this :


{
xtype: 'tricheckbox',
name: 'tri-check2',
fieldLabel: 'Checked',
checked: true,
disabled: true,
listeners: {
check: function() {
// write your code here
}
}
}

[harry.yoo]

Thanks, j.bruni for making this. It was working fantastically in ExtJS 3.x

Do you have any plan to make this work on 4.x?

[masood]

I seem to have an issue where the checkbox never receives focus. I am trying to tab through the form, but it always skips the tri-state checkbox.
Does anyone else have this issue?

Thanks

[claudio476]

I fix little bug: if try to set the initial value at null, the component don't set the right class.

i just change the follow condition:


if (inputEl) {
inputEl.dom.setAttribute('aria-checked', me.value == '1' ? true : false);
}
me['removeCls'](me.checkedClasses[oldCheck])
me['addCls'](me.checkedClasses[this.currentCheck]);
//}


new setRawValue:



setRawValue: function (v) {
var me = this;


if (v === false) v = '0';
if (v === true) v = '1';
if (v == null || v == '' || v === undefined) {
if (!this.triState)
v = '0';
else v = 'null';
}


var oldCheck = me.currentCheck;
me.currentCheck = me.getCheckIndex(v);
me.value = me.rawValue = me.values[me.currentCheck];


// Update classes
var inputEl = me.inputEl;
if (inputEl) {
inputEl.dom.setAttribute('aria-checked', me.value == '1' ? true : false);
}

me['removeCls'](me.checkedClasses[oldCheck])
me['addCls'](me.checkedClasses[this.currentCheck]);

},


Regards,
Claudio.

[wm003]

Is it possible like this :


{
xtype: 'tricheckbox',
name: 'tri-check2',
fieldLabel: 'Checked',
checked: true,
disabled: true,
listeners: {
check: function() {
// write your code here
}
}
}


The check-listener is still possible, but in your example you set the checkbox to "disabled". in that case the check event is not triggered (just like the original checkbox widget)