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);
    })

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar