I am trying to put a TokenField add-on inside of a VerticalLayout that appears when I click a PopupButton. The TokenField is added; however, most of the time I am not able to focus the field to get a cursor in it. Occasionally, if the field does get focused, I am unable to actually enter any input into the field. If a data source is set, pressing the down arrow does not bring up the the options like it should. I have tried using the TokenField elsewhere in my UI and it seems to be working as expected.
Here’s a minimal example of something I believe should work, but doesn’t:
PopupButton button = new PopupButton();
TokenField field = new TokenField();
Layout layout = new VerticalLayout();
layout.setWidth("100px");
layout.setHeight("100px");
layout.addComponent(field);
button.setContent(layout);
I have tried several other ways of doing this as well, including adding the TokenField to a Panel rather than a Layout, and also just doing:
button.setContent(new TokenField());
Everything I have tried ends up resulting in the same issues I have described above.
Can anyone provide a working code sample of what I am trying to accomplish? I have attached a picture in case my description wasn’t clear.
I am using Vaadin 7.1.1
EDIT:
After doing some more testing, I realized that the problem was that I was trying to do this in a modal window. Removing the modal attribute seemed to fix it (however the selected tokens are not rendered correctly). I do need this window to be modal, so if someone could provide a workaround, that would be great.
