1. #11
    Sencha - Community Support Team mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,236
    Vote Rating
    5
    mystix will become famous soon enough

      0  

    Default


    Quote Originally Posted by zilionis View Post
    Heh i made too few weeks ago, already posted here http://extjs.com/forum/showthread.ph...light=facebook
    yes i mentioned that 1 post above yours

    you're both using different approaches though -- you've used a combo for each input, while tintin directly extended a combo. it'd be interesting to see how both plugins develop.

  2. #12
    Ext User
    Join Date
    Nov 2007
    Posts
    4
    Vote Rating
    0
    zedisdead is on a distinguished road

      0  

    Default Is there a better way of doing this?

    Is there a better way of doing this?


    I added a way to include new tags that aren't on the data collection by overwriting onKeyUp property like this:

    Code:
    onKeyUp: function(e)
    		{
    			if(e.getKey() == e.ENTER)
    			{
    				var value = this.el.dom.value;
    				if(value.length > 0)
    				{
    					this.selectedValues[value] = value;
    					this.addBox(value, value);
    					this.el.dom.value = '';
    				}
    			}
    			else
    			{
    				if (this.editable !== false && !e.isSpecialKey()) 
    				{
    					this.lastKey = e.getKey();
    					if (e.getKey() == e.BACKSPACE && this.el.dom.value.length == 0) 
    					{
    						e.stopEvent();
    						this.collapse();
    						var el = this.maininput.prev();
    						if (el) 
    							el.focus();
    						return;
    					}
    					this.dqTask.delay(this.queryDelay);
    				}
    				
    				this.autoSize();
    				
    				Ext.ux.BoxSelect.superclass.onKeyUp.call(this, e);
    			}
    		},
    Is there a better way to do this?

    I also had to add the following to avoid errors on pibos's modifications:

    Code:
    Ext.each(this.value, function(item)
    			{
    				if(item)
    				{
    					if(this.displayFieldTpl)
    					{
    						caption = this.displayFieldTpl.apply(item);
    					}
    					else 
    					{
    						caption = item[this.displayField]
    					}
    					this.addBox(item[this.valueField], caption);
    				}
    			}, this);
    Thanks.

  3. #13
    Sencha - Community Support Team mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    2,748
    Vote Rating
    106
    mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all

      0  

    Default


    @Pibos: I get "Invalid argument" when trying to use your code to set the initial value (happens in both IE7 and FF3b5). It breaks in this section (line 2735 of ext-all-debug.js (v2.0.2)):

    Code:
    setWidth : function(width, animate){
            width = this.adjustWidth(width);
            if(!animate || !A){
                this.dom.style.width = this.addUnits(width);
            }else{
                this.anim({width: {to: width}}, this.preanim(arguments, 1));
            }
            return this;
        },
    
    Error: Width is NaN
    I think this is because the value property is already being used by the combobox, by changing the name to initialValue or whatever your code runs fine!

    another thing missing: a call to this.selectedValues[id] = id; in the addBox function. Otherwise initally loaded items will not be returned by the getValues() function...

    IE7/IE6: Box-corners are not rounded

  4. #14
    Sencha User
    Join Date
    Jan 2008
    Location
    Los Angeles
    Posts
    149
    Vote Rating
    1
    radtad is on a distinguished road

      0  

    Default


    Is there a way we can make this search through underlying data too perhaps? i.e. something that is not in the displayField. Also, it would be awesome to have this be a soundex search as well.

    just some thoughts...

  5. #15
    Ext User
    Join Date
    Oct 2007
    Posts
    25
    Vote Rating
    0
    sunny_boy is on a distinguished road

      0  

    Default


    Tintin - great extension thanks

    I was just testing in IE6, and noticed that if the length of the items inside the box become larger than the box itself, the items do not wrap correctly - see screenshot.

    Works fine in FF.

    I've had a look, but have not yet found a fix.

    Any ideas?
    Attached Images

  6. #16
    Ext User
    Join Date
    Oct 2007
    Posts
    25
    Vote Rating
    0
    sunny_boy is on a distinguished road

      0  

    Default


    Ok - I found a solution to the bug I raised earlier - though not sure if this is the best approach.
    Code:
    ul.holder { margin: 0; overflow: hidden; height: auto !important; height: 1%; padding: 0; }
    The overflow property was causing the issue in IE. Removing it fixed IE, but broke the display in FF. Instead of putting a hack in the css, I chose remove the overflow property from the css, and make the following change to the onRender function in Ext.ux.BoxSelect

    Code:
    onRender:function(ct, position) {
    		Ext.ux.BoxSelect.superclass.onRender.call(this, ct, position);
    
    		this.el.removeClass('x-form-text');
    		this.el.className = 'maininput';
    		this.el.setWidth(20);
    
    		this.holder = this.el.wrap({
    			'tag': 'ul',
    			'class':'holder x-form-text'
    		});
    		if(!Ext.isIE) {
    			this.holder.dom.style.overflow='hidden';
    		}
    				
    		this.holder.on('click', function(e){
    			e.stopEvent();
    			if(this.maininput != this.current) this.focus(this.maininput);		 
    		}, this);
    
    		this.maininput = this.el.wrap({
    			'tag': 'li', 'class':'bit-input'
    		});
    		
    		Ext.apply(this.maininput, {
    			'focus': function(){
    				this.focus();
    			}.createDelegate(this)
    		});
    		
    	},
    Any suggestions on a better way to do this?

  7. #17
    Sencha - Community Support Team mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,236
    Vote Rating
    5
    mystix will become famous soon enough

      0  

    Default


    @sunny_boy, Ext automatically adds a browser-specific CSS class to the <body> tag.

    e.g. ext-gecko, or ext-ie

    use some css like this instead
    Code:
    ul.holder { margin: 0; overflow: hidden; height: auto !important; height: 1%; padding: 0; }
    .ext-gecko ul.holder { overflow: hidden;}
    [edit]
    i haven't dived into this plugin yet, so you might want to somehow make those css rules more specific so they only apply to this plugin.

  8. #18

  9. #19
    Ext User
    Join Date
    Apr 2008
    Location
    PARIS
    Posts
    9
    Vote Rating
    0
    aproust94 is on a distinguished road

      0  

    Exclamation Something wrong without setting the value config option

    Something wrong without setting the value config option


    Thank you Tintin for this great Extension and also to you Pibos for your improvement.
    Pibos, there is something wrong if you don't set 'value' config option. Ext.ux.Boxselect throws an exception. I suggest you to replace the following code at line number (163 ?) :
    PHP Code:
            if(this.value){
                if(
    typeof this.value === 'string')
                    
    this.value = [this.value]
            }
            
          
    Ext.each(this.value, function(item){
            
              if(
    this.displayFieldTpl)
                   
    caption this.displayFieldTpl.apply(item);
               else
                    
    caption item[this.displayField]
                    
                 
    this.addBox(item[this.valueField], caption);
           }, 
    this); 
    by this one :
    PHP Code:
    if(typeof this.value !== 'undefined'){
                if(
    typeof this.value === 'string')
                    
    this.value = [this.value]
            
            
                
    Ext.each(this.value, function(item){
            
                    if(
    this.displayFieldTpl)
                        
    caption this.displayFieldTpl.apply(item);
                    else
                        
    caption item[this.displayField]
                    
                    
    this.addBox(item[this.valueField], caption);
                }, 
    this);
        } 
    And now, all works fine.

    Al
    http://www.123messagepro.com convert your text into vocal message with background music !!

  10. #20
    Sencha User
    Join Date
    Aug 2007
    Location
    Munich, Germany
    Posts
    135
    Vote Rating
    0
    gelleneu is on a distinguished road

      0  

    Default Question

    Question


    I have a question about this great extension.

    I use it inside a form, and I want to save the items in a database.

    When i submit my form, the items will be appended as post vars in this way:

    (field name = "boxselectfield", values are Id's of the items)

    boxselectfield=23&boxselectfield=25&boxselectfield=

    Reading this post vars in PHP with $_REQUEST['boxselectfield'] results only the last
    value, and this value is empty.

    Has someone experience with that?

    My next question: if an item is not in the list, i want to add it to the list automatically (a database operation is needed for that.)

    Is there are solution for that?

    Thanks!