How to hide suggestions in GWT SuggestBox?

Question

I am using GWT 2.4. I have a Suggestbox and I have a requirement to hide the suggestion list under certain cases. The context is as below.

After user selects a suggestion from suggestion list, I am populating two other text box fields, with values corresponding to the selection. For example, suppose the suggestbox contains user-names, and user selects a user-name from suggestions, then other two fields, say user address and email are populated in two other text boxes. These two fields are read only now. Then user clicks on an 'Edit' button. Now the user can edit either user- name ( ie edit in suggestion box), user address and email. It doesn't make sense to show the suggestions again when the user is editing the user-name, since the user has already selected the user and decided to edit it. In a nutshell my SuggesBox should behave as a normal text box. I tried following code, (I know hideSuggestionList() is deprecated) but its not working.

display.getSuggestBox().hideSuggestionList();

Reading the javadoc for hideSuggestionList() it is said that, "Deprecated. use DefaultSuggestionDisplay.hideSuggestions() instead". I don't know how to use DefaultSuggestionDisplay, and I'm using SuggestBox with 'MultiWordSuggestOracle'.

Thanks for helping me out!!

Answer 1

What you can do is simply swap the SuggestionBox with a normal TextBox when the user clicks edit and back when edit is closed. Also because if you would hide the suggestions list, it still queried from the server. By swapping the widget you don't have to care about side effects. SuggestionBox itself uses also a TextBox and thus for the user it's not visible the widget has changed.

Answer 2

If you don't use your own SuggestionDisplay, then this should Just Work™:

((DefaultSuggestionDisplay) suggestBox.getSuggestionDisplay()).hideSuggestions();

Answer 3

Here is the Solution

My Entry Point Class

public class SuggestionEntryPoint implements EntryPoint {

    @Override
    public void onModuleLoad() {
        SuggestBoxWidget suggestBoxWidget = new SuggestBoxWidget();
        RootPanel rootPanel = RootPanel.get();
        suggestBoxWidget.createOracle();
        suggestBoxWidget.createWidgetAndShow(rootPanel);
        rootPanel.add(suggestBoxWidget);
        DOM.getElementById("loader").removeFromParent();
    }

}

And here is my Widget

public class SuggestBoxWidget extends Composite {

    private TextBox textSuggestBox = new TextBox();

    private SuggestBox suggestBox = null;

    DefaultSuggestionDisplay suggestionDisplay = new DefaultSuggestionDisplay();

    MultiWordSuggestOracle suggestOracle = new MultiWordSuggestOracle();

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

    interface SuggestBoxWidgetUiBinder extends
        UiBinder<Widget, SuggestBoxWidget> {
    }

    public SuggestBoxWidget() {
        initWidget(uiBinder.createAndBindUi(this));     
    }

    public void registerEvents(){
        suggestBox.addKeyUpHandler(new KeyUpHandler() {
            @Override
            public void onKeyUp(KeyUpEvent event) {
                if(suggestBox.getText().equalsIgnoreCase("1")){                 
                    suggestionDisplay.hideSuggestions();
                }
            }
        });
    }

    public void createWidgetAndShow(HasWidgets container){
        suggestBox = new SuggestBox(suggestOracle,textSuggestBox,suggestionDisplay);
        container.clear();
        container.add(suggestBox);      
        registerEvents();
    }

    public void createOracle(){
        for(int i=1;i<=100;i++){
            suggestOracle.add(i+"");
        }
    }

}

Actually you have to create a SuggestBox with 3 Parameters to the Constructor.