Ext.ux.form.SuperBoxSelect as seen on facebook and hotmail

[grzegorz.borkowski]

Is there a way to force it to except only one value (kind of like a normal combo)?

That's exactly what was yesterday's hot topic

[dvuja2]

Lazy reader

Did anybody test validationEvent: false? It doesn't work for me.

[phillipL]

Hello,

while using the SuperBoxSelect, I noticed that values the user inserts into the box containing the delimiter are not splitted after pressing enter before they are assigned to the box. I would prefer a behavior like that implemented in the setValue() method, which splits the values at the delimiter.

Example:
New value inserted: My new value, another value, third value
After Pressing enter: (My new value, another value, third value)
Preferred behavior : (My new value) (another value) (third value)

What is your opinion about that?

Regards,
Phillip

[grzegorz.borkowski]

Two small issues/bugs that I observed recently:
1. I wanted to render box items as links (I mean text on box items is rendered as link). It can be done easily using displayFieldTpl. However, clicking on such link doesn't work - the event is captured and stopped. The culprit is this method:

 enableElListeners : function() {
        this.el.on('click', this.onElClick, this, {stopEvent:true});

        this.el.addClassOnOver('x-superboxselect-item x-superboxselect-item-hover');
    },

I changed "stopEvent" to "stopPropagation" and links started to work (I also haven't observed any negative side effects of this change):

 enableElListeners : function() {
        this.el.on('click', this.onElClick, this, {stopPropagation:true});

        this.el.addClassOnOver('x-superboxselect-item x-superboxselect-item-hover');
    },

2. When we already have the items rendered as links, it looks strange that the "Remove item" button (the "X" button on the item box) is rendered as link too, and you see dummy URL in browser status bar while hovering over this button. So I've found this code:

var btnEl = this.owner.navigateItemsWithTab ? ( Ext.isSafari ? 'button' : 'a') : 'span';

It looks suspicious to me: why the "a" is used as default, and "button" only on Safari? IMHO, the "button" default is much more reasonable (becuase what you see in UI is actually a button). The only explanation for using link is to to have hover effect in IE6. So I changed it to:

var btnEl = this.owner.navigateItemsWithTab ? ( Ext.isIE6 ? 'a' : 'button') : 'span';

I had to also change the code a few lines below to make it work properly:

        if(btnEl === 'a'){
            cfg.href = '#';
        }
        //change default "submit" type to "button" to prevent dummy URL showing up in browser status bar on hover
        if(btnEl === 'button'){
            cfg.type = 'button';
        }

Now it renders as "button" in all browsers except IE6, and works better, because you don't see the dummy link URL on hover.

[woooop]

Hi all ,first of all , congrats to the author for this amazing extension

I am having an error when using it and not find out why.

I have a window with a form inside, and a superboxselect in their fields, with settings:

allowBlank:false,
xtype:'superboxselect',
id:'test',
name :'test',
fieldLabel: 'test',
emptyText: 'test',
store: myStore,
mode: 'local',
displayField: 'Name',
displayFieldTpl: '{Name}',
valueField: 'UserId'

When I open that window to close it show me an error

This.store is null (this.store.clearFilter) on SuperBoxSelect.js line 1011

In another window and a different designation form, which makes is that the entire form disappears.

I try with the examples states store , and same error

Does anyone have an idea that could be happening?

Thanks a lot

[woooop]

Seems to be related to the this.resetStore(); call in killItems function . If i comment this line, everything seems to work ok

[danh2000]

Hi all ,first of all , congrats to the author for this amazing extension

I am having an error when using it and not find out why.

I have a window with a form inside, and a superboxselect in their fields, with settings:

allowBlank:false,
xtype:'superboxselect',
id:'test',
name :'test',
fieldLabel: 'test',
emptyText: 'test',
store: myStore,
mode: 'local',
displayField: 'Name',
displayFieldTpl: '{Name}',
valueField: 'UserId'

When I open that window to close it show me an error

This.store is null (this.store.clearFilter) on SuperBoxSelect.js line 1011

In another window and a different designation form, which makes is that the entire form disappears.

I try with the examples states store , and same error

Does anyone have an idea that could be happening?

Thanks a lot

I have my own test case for opening a window and closing it which works without error. If you are having problems, please post a copy-pasteable test case as per this thread:

http://www.extjs.com/forum/showthread.php?t=71015

Thanks.

[Stju]

In 3.1.1 this line in ext-all.css looks like is conflicting

.ext-strict .x-small-editor .x-form-text {
    height:16px !important;
}

making superbox container unable to stretch vertically.

In 3.0 height is defined without '!important', thus removed, puts everything back in place, but probably destroys something else, as I guess it's made the way there for purpose ...

[Stju]

Hi All,

UPDATE 18/01/2009

Fixed regression where disabling the component didn't properly disable the items.

UPDATE 16/01/2009 (Part 2)

Fixed to prevent extra empty hiddenName value from being posted.
.
.
.

Just wanted to notice, that great Year of 2010 is here (This years updates are still marked as 2009)
Have a nice weekend!
Stju

[danh2000]

Thanks @Stju

I'll look at the CSS and change the update years - doh!