autocomplete in vaadin?

Question

I'm new to vaadin. How do I do autocomplete (actually, more like google suggest) on a huge set of data that cannot be loaded in memory, but instead performing a JPA query on every key event. Is it possible to capture key events on a textfield or combobox?

Answer 1

You could check out Henrik Paul's SuperImmediateTextField, which is a Vaadin add-on that allows you to set the client-to-server post delay in seconds. From that on it's common Java stack to get the flow as smooth as possible. Caching, JPA requests or something else. A couple of second's delay will at least slightly lessen the load to server side.

Answer 2

You may find this link helpful. I guess this is getting fixed in 6.5. There is also an addon if you want to check.

you need to consider this though

field value -> json -> vaadin servlet -> service (spring/ejb/pojo or whatever) -> JPA -> query -> result list (which may be huge initially)

and this all the way back to browser for every key press...

think about the end user's typing speed. By the time 1st keystroke's response comes back from the server, user might have completed the whole word.

Answer 3

The instant TextField should be what you are looking for. Take a look at the Sampler demo: http://demo.vaadin.com/sampler/#TextFieldTextChangeEvent

Answer 4

If you don't want to write a custom client-side widget or include another add-on, you can tweak Vaadin's ComboBox a bit to make it load suggestions from the database. You basically have to do three things to achieve that:

1. Subclass com.vaadin.ui.ComboBox and overwrite its protected method ComboBox#buildFilter() with your own implementation.
2. Implement interface com.vaadin.data.Container.Filter with very restricted functionality: your Filter only needs to transport the current user input.
3. Write an implementation of com.vaadin.data.Container that performs the actual filter logic.

I described how to do that in more detail in a blog post.

Answer 5

maybe checkout this addon: https://vaadin.com/directory#!addon/suggestbox-add-on

comes with:

delay for server communication, e.g. wait till user finished typing for n miliseconds

placeholder text like 'type your query here'

minimum length for input to query the server