PDA

View Full Version : Combo box with multiple value



Jerome C.
21 Oct 2009, 7:23 AM
Hello,

I want to do a combo box which can accept multiple values. The goal is to simulate an auto suggest like an IDE.

Example:

I want to write in my combo box an equation for a game:
FOR+INT+AGI

In combo box I've got the key words: FOR, INT, AGI, ACT.

workflow needed:
F > suggest FOR
FOR+ > suggest FOR, INT, AGI, ACT
FOR+I > suggest INT
FOR+INT+A > suggest AGI, ACT

this also can be useful for tags
flower, nature, beauty

yui implements it:
http://developer.yahoo.com/yui/examples/autocomplete/ac_tags_alwaysshow.html

is this functionnality exists ? (I don't find it)
or what is the best approach to do it ?

thanks ;)

sven
22 Oct 2009, 4:08 AM
These functionality does not exist directly, but it is possible. The dropdownlist of a combobox is a listview. This listview does support multiselection. You need to extend combobox and override the behaviour that happens, when the selection in the listview changes.

Jerome C.
23 Oct 2009, 5:57 AM
Thanks,

I finally got it.

I use a custom property editor (override getStringValue) to append it to raw value instead of erasing it.

after it, I override the doQuery of my combobox to specify a separator like it:


@Override
public void doQuery(String q, boolean forceAll)
{
String query = q;

int idx = getRawValue().lastIndexOf(',');

if (idx >= 0) query = getRawValue().substring(idx+1);

super.doQuery(query, forceAll);
}with this code, the list view filters only characters after the last ','

BUT I have a problem with this:
when I try:
tag1,

just after the ',' all the text is selected.

After analyzing your source code, here is the cause:
File ComboBox.java
line 1242 (gxt 2.0.4)


protected void onLoad(StoreEvent<D> se) {
if (!isAttached() || !hasFocus()) {
return;
}
if (store.getCount() > 0) {
if (expanded) {
restrict();
} else {
expand();
}

if (lastQuery != null && lastQuery.equals(allQuery)) {
if (isEditable()) {
selectAll();
}
} else {
if (typeAhead) {
taTask.delay(typeAheadDelay);
}
}
if (!selectByValue(getRawValue())) {
select(0);
}
} else {
onEmptyResults();
}
}there is a selectAll() when the query is equivalent to allQuery.

It's really problematic for me and my multi selection.

I can override this function and after calling super I can reset the selection but it's a little tricky.


here the code (lastQuery is fortunately protected)


@Override
protected void onLoad(StoreEvent<BeanModel> se)
{
super.onLoad(se);

if (lastQuery.equals(getAllQuery()))
{
setCursorPos(getRawValue().length());
}
}


GXT team, do you think it's can be a little getter/setter in a future release to avoid this behavior ?
or do you have a better solution to fix it ?

diegolovison
23 Oct 2009, 9:07 AM
http://www.extjs.com/forum/showthread.php?t=73726

??

subhransu2417
6 Sep 2010, 1:25 AM
hey how to set the values in the combobox after adding comma. Whenever we are selecting the second value after comma, combobox is deleting the previous value from the box. Can anyone help me on this?