1. #1
    Ext JS Premium Member mikegiddens's Avatar
    Join Date
    Mar 2007
    Location
    Denver, Colorado
    Posts
    273
    Vote Rating
    1
    mikegiddens will become famous soon enough

      0  

    Default [2.0] Ext.ux.TwinComboBox to Clear Field

    [2.0] Ext.ux.TwinComboBox to Clear Field


    I have made a small extension to clear the value from the ComboBox. It uses a listener 'clear' so you can do something once the value has been cleared. It also clears the [x] if the you call form.reset()

    Known Issues: All the config issues are the same as ComboBox except hideTrigger needs to be hideTrigger2. I have not figured out how to solve this but no biggie.

    Code:
    /**
     * Makes a ComboBox have a twin trigger that is used to clear the value from the field.
     * User listener 'clear' to do something.
     *
     * @author Michael Giddens & help from Animal, jSakalos, Jack
     * http://extjs.com/forum/showthread.php?p=76130
     *
     * @history 2007-10-21 jvs
     * Combobox Mod for Ext 2.0
     */
    Ext.ux.TwinComboBox = Ext.extend(Ext.form.ComboBox, {
            initComponent : Ext.form.TwinTriggerField.prototype.initComponent
        ,    getTrigger : Ext.form.TwinTriggerField.prototype.getTrigger
        ,    initTrigger    : Ext.form.TwinTriggerField.prototype.initTrigger
        ,    trigger1Class    :    'x-form-clear-trigger'
        ,    hideTrigger1 : true
    //    ,    onTrigger2Click : Ext.form.ComboBox.prototype.onTriggerClick // Not sure if needed ???
    //    ,    hideTrigger2: Ext.form.ComboBox.prototype.hideTrigger      // Does not map hideTrigger ???
    
        , reset : Ext.form.Field.prototype.reset.createSequence(function(){
            this.triggers[0].hide();
            })
        
        , onViewClick :    Ext.form.ComboBox.prototype.onViewClick.createSequence(function(){
            this.triggers[0].show(); // Added to show trigger
            })
        
      , onTrigger2Click : function(){
                this.onTriggerClick();
            }
    
      , onTrigger1Click : function(){
                this.clearValue();
                this.triggers[0].hide();
          this.fireEvent('clear', this);
          }
            
    });
    Related Thread: http://extjs.com/forum/showthread.php?t=15842
    Attached Images
    Mike Giddens
    =======================
    Opportunity is missed by most people because it is dressed in overalls and looks like work - Thomas Edison

  2. #2
    Ext User
    Join Date
    Apr 2007
    Posts
    379
    Vote Rating
    0
    sfwalter is on a distinguished road

      0  

    Default


    Its cool but after clicking the "x" and then calling this code:

    Code:
     Ext.getCmp("damageTypeCombo").getValue()
    getValue() is still returning a value. Could it be because I'm using the hidden name property on the combo box?

  3. #3
    Ext User mdelanno's Avatar
    Join Date
    Mar 2007
    Location
    France
    Posts
    71
    Vote Rating
    0
    mdelanno is on a distinguished road

      0  

    Default Use 1-dimensional array

    Use 1-dimensional array


    Ext.ux.TwinComboBox does not support 1-dimensional array in store config. You should use this code to load your array :
    Code:
    var myTwinCB = new Ext.ux.TwinComboBox({
      [..]
      displayField: "text",  
      mode: "local",
      store: new Ext.data.SimpleStore({
        expandData: true,
        fields: ['text'],
        data: ["a", "b", "c", "d"]
      }),  
      valueField: "text"
    })

  4. #4
    Sencha User
    Join Date
    Mar 2007
    Posts
    210
    Vote Rating
    1
    KRavEN is on a distinguished road

      0  

    Default


    Here's an Extjs 3.x version that also resolved the array store issue:

    Code:
    Ext.namespace('Ext.ux.form');
    Ext.ux.form.TwinComboBox = Ext.extend(Ext.form.ComboBox, {
      getTrigger : Ext.form.TwinTriggerField.prototype.getTrigger,
      initTrigger : Ext.form.TwinTriggerField.prototype.initTrigger,
      trigger1Class : 'x-form-clear-trigger',
      hideTrigger1 : true,
    
      initComponent : function() {
        Ext.ux.form.TwinComboBox.superclass.initComponent.call(this);
    
        this.triggerConfig = {
          tag : 'span',
          cls : 'x-form-twin-triggers',
          cn : [{
            tag : 'img',
            src : Ext.BLANK_IMAGE_URL,
            cls : 'x-form-trigger ' + this.trigger1Class
          }, {
            tag : 'img',
            src : Ext.BLANK_IMAGE_URL,
            cls : 'x-form-trigger ' + this.trigger2Class
          }]
        };
      },
    
      reset : Ext.form.Field.prototype.reset.createSequence(function() {
        this.triggers[0].hide();
      }),
    
      onViewClick : Ext.form.ComboBox.prototype.onViewClick.createSequence(function() {
        this.triggers[0].show();
      }),
    
      onTrigger2Click : function() {
        this.onTriggerClick();
      },
    
      onTrigger1Click : function() {
        this.clearValue();
        this.triggers[0].hide();
        this.fireEvent('clear', this);
      }
    });
    Ext.ComponentMgr.registerType('twincombo', Ext.ux.form.TwinComboBox);

  5. #5
    Sencha User
    Join Date
    Aug 2009
    Posts
    3
    Vote Rating
    0
    inelation is on a distinguished road

      0  

    Default I would change this to get all built in combo box functionality such as autocomplete

    I would change this to get all built in combo box functionality such as autocomplete


    initComponent : Ext.form.TwinTriggerField.prototype.initComponent.createSequence(function() {
    Ext.form.ComboBox.prototype.initComponent.call(this);
    })

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi