Search code examples
gwtoverridingsuggestbox

GWT Suggestion box override default behaviour


I have a textbox for search the product in my application. When the user entered something into the textbox, it should show the suggestions so that user can search in any particular product category.

For Example, if the products are categorized as Men, Women, Kids, Summer, Winter and user entered "foot wear", the suggestion list should show the below:

foot wear in Men
foot wear in Women
foot wear in Kids
foot wear in Summer
foot wear in Winter

on the KeyUp Event, I clear the current suggestions and populate the new suggestions list by appending each category name with the user typed in text. It works fine as far the user does not type in anything matches the category name. That is if the user entered "Win", the suggestion shows only

Wi in Winter

But I expect the suggestions to be

Win in Men
Win in Women
Win in Kids
Win in Summer
Win in Winter

Can anyone tell what could be wrong.

Thanks.

Update - Attached the CODE

I actually created a custom widget. below is my java and xml template

public class MySearchBox extends Composite implements IsWidget, HasKeyDownHandlers, HasSelectionHandlers<Suggestion>, KeyUpHandler, ClickHandler, BlurHandler
{

private static MySearchBoxUiBinder uiBinder = GWT.create(MySearchBoxUiBinder.class);

interface MySearchBoxUiBinder extends UiBinder<Widget, MySearchBox>
{
}

private static final List<String> PDT_CHANNELS = Arrays.asList("Men", "Women", "Kids", "Summer", "Winter");

@UiField
SuggestBox mySuggestionBox;

public MySearchBox()
{
    initWidget(uiBinder.createAndBindUi(this));
    initialize();
}

private void initialize()
{

    mySuggestionBox.getTextBox().addKeyUpHandler(this);
    mySuggestionBox.getTextBox().addClickHandler(this);
    mySuggestionBox.getTextBox().addBlurHandler(this);

}

@Override
public void onKeyUp(final KeyUpEvent event)
{
    if(event.getNativeKeyCode() != KeyCodes.KEY_ENTER)
    {
        populateOracle(mySuggestionBox.getText().trim());
    }
}

private void populateOracle(final String inputText)
{

    String searchText = "";
    if(inputText != null)
    {
        searchText = inputText.trim();
    }
    if((searchText == null || searchText.length() < 1))
    {
        clearOracle();
        mySuggestionBox.showSuggestionList();
        return;
    }
    final List<String> oracleSuggestions = new ArrayList<String>();
    for(String scope : PDT_CHANNELS)
    {
        oracleSuggestions.add(searchText + " in " + scope);
    }
    populateOracle(oracleSuggestions);

}

private void clearOracle()
{
    final MultiWordSuggestOracle oracle = (MultiWordSuggestOracle)mySuggestionBox.getSuggestOracle();
    final DefaultSuggestionDisplay suggestionDisplay = (DefaultSuggestionDisplay)mySuggestionBox
            .getSuggestionDisplay();
    if(suggestionDisplay.isSuggestionListShowing())
    {
        suggestionDisplay.hideSuggestions();
    }
    oracle.clear();
}

private void populateOracle(final List<String> data)
{
    final MultiWordSuggestOracle oracle = (MultiWordSuggestOracle)mySuggestionBox.getSuggestOracle();
    oracle.clear();
    oracle.addAll(data);
    final DefaultSuggestionDisplay suggestionDisplay = (DefaultSuggestionDisplay)mySuggestionBox
            .getSuggestionDisplay();
    if(!suggestionDisplay.isSuggestionListShowing())
    {
        mySuggestionBox.showSuggestionList();
    }
}

@Override
public HandlerRegistration addSelectionHandler(final SelectionHandler<Suggestion> handler)
{
    return mySuggestionBox.addHandler(handler, SelectionEvent.getType());
}

@Override
public HandlerRegistration addKeyDownHandler(final KeyDownHandler handler)
{
    return mySuggestionBox.addHandler(handler, KeyDownEvent.getType());
}
}

XML Template:

</ui:style>
    <g:SuggestBox ui:field="mySuggestionBox"></g:SuggestBox>
</ui:UiBinder> 

Solution

  • I identified what went wrong in my code. I cleared the suggestion list by calling clearOracle(); and then adding new suggestions. It worked. Thanks everyone.

    private void populateOracle(final String inputText)
    {
    
        String searchText = "";
        if(inputText != null)
        {
            searchText = inputText.trim();
        }
        clearOracle();
        if((searchText == null || searchText.length() < 1))
        {
    
            mySuggestionBox.showSuggestionList();
            return;
        }
        final List<String> oracleSuggestions = new ArrayList<String>();
        for(String scope : PDT_CHANNELS)
        {
            oracleSuggestions.add(searchText + " in " + scope);
        }
        populateOracle(oracleSuggestions);
    
    }