TwinTriggerField hide trigger

[xun]

hi, I have custom component that extends from 'Ext.form.field.Trigger'.

Code as following

Ext.define('Ext.ux.SearchTwinTriggerField',{


    extend: 'Ext.form.field.Trigger',


    initComponent: function () {
        this.callParent();
        this.on('specialkey', function (f, e) {
            if (e.getKey() == e.ESC) {
                this.onTrigger1Click();
            }
        }, this);


        
   },


    validationEvent: false,
    validateOnBlur: false,
    trigger1Cls: 'x-form-clear-trigger',
    trigger2Cls: 'x-form-search-trigger',
    hideTrigger1: true,
   
    width: 180,
    hasSearch: false,
    paramName: 'search',
    params: {},
   
    onTrigger1Click: function () {


        if (this.hasSearch) {
            Ext.Function.defer(this.setValue, 1, this, ['']);
            var o = { start: 0 };
            this.store.baseParams = this.store.baseParams || {};
            this.store.baseParams[this.paramName] = '';
            this.store.proxy.params = o;
            this.store.load();
            this.triggerEl.item(0).hide();
            this.hasSearch = false;
        }
    },
    onTrigger2Click: function () {
        var v = this.getRawValue();
        if (v.length < 1) {
            this.onTrigger1Click();
            return;
        }
        var o = { start: 0 };
        this.store.baseParams = this.store.baseParams || {};
        this.store.baseParams[this.paramName] = v;
        this.store.proxy.params = o;
        this.store.load();
        this.hasSearch = true;
        this.triggerEl.item(0).show();
    }
});

I have trouble to hide the 1st trigger on initial rendering.

Also based on some event, I would like show / hide the first trigger. The hide trigger works, however it leaves an empty space there and makes the control look ugly.

Can someone help out? thanks

[lagnat]

See if this helps: http://www.sencha.com/forum/showthread.php?154336

[xun]

showATrigger: function(whichTrigger) { var theCell = this.triggerEl.item(whichTrigger).up('td'); theCell.setDisplayed('block'); }
I do not understand why I cannot reply to the thread quoted above. Anyway, yes, the hide part works, but the show somehow does not make any difference

[xun]

The showATrigger() function should be as below

showATrigger: function(whichTrigger) { var theCell = this.triggerEl.item(whichTrigger).up('td'); theCell.setDisplayed(''); }

[lagnat]

I had made some changes locally since my last post to that thread. I just posted the code that I've been using for a while now.