[NEW-ADDON] AutocompleteField

I just put my
AutocompleteField
in the Vaadin directory. It’s a text input that displays suggestions in a popup while the user is typing. The query is tipically run against some search service, and you can be notified when the user selects an option, or can later read the text when processing another event.

It’s kind of a ComboBox, but without a backing Container because options are retrieved dynamically.

I’m only developing this since a couple of days, so the API may change. Feedback is welcomed. The project sources are on [url=https://github.com/RaffaeleSgarro/vaadin-autocomplete]
GiitHub


[/url]

Great, this is something that is quite often used in different projects. Could you add some screenshots and/or code example of the widget’s usage?

Hi Kim,
I have a questen in
https://vaadin.com/forum#!/thread/7770525

Can you Please look over it…

@Kim, screenshot attached. The code sample can be seen on
GitHub
, and if you need any advice on how to use it, don’t hesitate to ask. At the moment the API is experimental, so I don’t want to spread snippets that will be out-of-date in the next few hours around the world. As soon as possible I’ll put the demo on GAE.

If anyone is interested in reviewing the code or participating in the development, please let me know.

Hi there, can you pls help me configure widgetset so I can use your addon. I’m not quite into it yet. Thnx!

I got message on my form:

Widgetset ‘com.vaadin.DefaultWidgetSet’ does not contain implementation for com.zybnet.autocomplete.server.AutocompleteField. Check its component connector’s @Connect mapping, widgetsets GWT module description file and re-compile your widgetset. In case you have downloaded a vaadin add-on package, you might want to refer to add-on instructions.

You have to declare and compile a custom widgetset for your project.
Create a .gwt.xml File in your project as explained here:
https://vaadin.com/book/vaadin6/-/page/gwt.widgetset.html
(You mainly need the inherit from the DefaultWidgetset not the set-property or anything else).
Then you have to define the widgetset inside your web.xml or ServletAnnotation and compile it (described here
https://vaadin.com/book/vaadin6/-/page/addons.compiling.html
in case you have the annotations it would be something like widgetset=com…yourwidgetset).
There should be enough information on the web if you get stuck. It’s pretty much the same process for all addons which have client side coding.

Thank you,

Configuration in my web.xml is ok. vaadin:compile can use my Widgeset.gwt.xml

Widgeset.gwt.xml:

<?xml version="1.0" encoding="UTF-8"?>

However after vaadin:compile it says:
GWT Module com.zybnet.autocomplete.AutocompleteWidgetSet not found in project sources or resources.

vaadin-autocomplete.jar is in the build path, and I can use classes from it in my project. Any ideas what can be wrong?

Is there the posibility to add a Blur and FocusListener on the component?

The input is a
VTextField
, and it has the required API, but currently neither the client nor the server side of the component expose it. I’m not sure I want to add these APIs because Vaadin widgets don’t do it and I guess there is a reason (maybe it’s simply to prevent blocking the UI for the time of the round trip in the case of such a lightweight and recurring event). May I ask why you need it?

Is this the first time you try to use a client-side component from the Vaadin directory in this project? I see you use Maven to compile the widgetset, but I have not put the addon on Central yet, so you may have troubles in actually adding the JAR to the path searched by the GWT compiler. Can you make a
gist
of your pom.xml? If your project is on GitHub or any other public repository, please link to it, so we can run the command in the same environment as you

I want to register a shortcutListener to the autocompleteField while it has focus.
So I add the Shortcut when the component got focus and remove it when it loses focus.

Is the shortcut listener also fired when the focus is on another component?

No, only if the focus on the specified component.

What I meant was, what’s wrong if you simply use
AutocompleteField.addShortcutListener
(inherited from AbstractComponent) instead of adding/removing the listener when the text box is focused?

We have several components like ComboBox, TextField, AutocompleteField,… on a panel. Every component has a shortcut (the same keys for all components) to open a helptext. So, the shortcut should only work if the cursor is in the component so that we know which component is on focus and that we can display the right text for each component.

After looking at the APIs for TextField and ComboBox, I realized my assumptions were wrong: both expose the API to add focus and blur listeners, so the AutocompleteField should do the same :slight_smile:

It should be really easy to add this functionality: you can fork the project on GH and send me a pull request to speed things up.

In the meanwhile, I added this stuff to me queue and will address it in the next few days

I happen to have the same issue - is there any solution to this?

Can you increase the compiler log level? Certain compilation errors may be suppressed. BTW, I’m going to put the artifact on Maven central

I released the component to the Central repository

<dependency>
  <groupId>com.zybnet</groupId>
  <artifactId>vaadin-autocomplete</artifactId>
  <version>1.0.0</version>
</dependency>