Ext.ux.form.field.ClearButton - Small clear button/icon over field

[mmarti]

Very nice!!! Good work, thank you!!!

[grgur]

+1

[wki01]

a small bug:
It should not be active if the field is disabled or readonly.
You can fix it?
thanks

[softwareguy]

Nice!

[loiane]

Nice!

[slemmon]

a small bug:
It should not be active if the field is disabled or readonly.
You can fix it?
thanks

Yeah, looks like in FF the disabled field is honored and not in IE 8 (didn't test others). And readOnly displays the X as well - at least in FF. Didn't test in IE.

That said, VERY COOL plugin. I had modified a triggerfield to show/hide the X trigger when there is a value in the field and that worked, but lacked the sexy value this plugin adds. You have any sway with the devs for an inclusion of this feature in 4.2?

[Radius-Service]

Very good.

Please add a custom event handler to "clean up".

[austin1030]

Is there a way not to delete data when the field is set as "readOnly"?

[ldonofrio]

Thanks for this,

I'm having problems with combos with multiSelect: true, setValue('') causes that the combo value to be [''] that is not true, combo value must be [] (0 items selected).

I've to override click and ESC handlers and change se setValue stuff by reset().

Here is the code

                            addEscListener: function() {
                                if (!this.clearOnEscape) return;
                                this.textField.inputEl.on('keydown', function(e) {
                                    if (e.getKey() == Ext.EventObject.ESC) {
                                        if (this.textField.isExpanded) return;
                                        Ext.Function.defer(this.textField.reset, 1, this.textField);
                                        e.stopEvent();
                                    }
                                }, this);
                            },
                            handleMouseClickOnClearButton: function(event, htmlElement, object) {
                                if (!this.isLeftButton(event)) return;
                                this.textField.reset();
                                this.textField.focus();
                            } 

Regards,

Leonardo

[PHaroZ]

nice plugin but i've same trouble with combobox.

Because reset is not the same as clear value, I do this :

init : function(textField) {
    this.textField = textField;
    this.textField.addEvents('clear');
    if (!textField.rendered) {
        textField.on('afterrender', this.handleAfterRender, this);
    } else {
        // probably an existing input element transformed to extjs field
        this.handleAfterRender();
    }
},
addEscListener: function() {
    if (!this.clearOnEscape) return;
    this.textField.inputEl.on('keydown', function(e) {
    if (e.getKey() == Ext.EventObject.ESC) {
        if (this.textField.isExpanded) return;
        Ext.Function.defer(this.clearValue, 1, this);
        e.stopEvent();
    }
    }, this);
},
handleMouseClickOnClearButton: function(event, htmlElement, object) {
    if (!this.isLeftButton(event)) return;
    this.clearValue();
    this.textField.focus();
},
clearValue : function() {
    if (Ext.isFunction(this.textField.clearValue)) {
        this.textField.clearValue();
    } else {
        this.textField.setValue('');
    }
    this.textField.fireEvent('clear', this.textField);
}