Hello,
It’s my first time in forum, so hello everybody. Iban, from Spain.
I’m migrating an application from Vaadin 7 to 8 and I’m having problems populating a value in a RichTextArea component using the Vaadin 8 Binder.
For testing purpose, I’ve tried the same adding a TextField and in this component it works perfectly. It shows the data… I think I’m missing something…
Using BeanFieldGroup from Vaadin 7 worked perfectly
Code from Vaadin 7
@PropertyId("textValue")
@Getter private RichTextArea richTextArea = new RichTextArea();
private BeanFieldGroup<WorkProjectValuesEntity> binder = new BeanFieldGroup<WorkProjectValuesEntity>(WorkProjectValuesEntity.class);
private WorkProjectValuesEntity entity;
public RichTextAreaFieldModule(){}
@Override
public Component create(WorkProjectModulesEntity moduleItem) {
this.moduleItem = moduleItem;
getWorkProjectValuesEntity();
binder.setItemDataSource(entity);
binder.bind(richTextArea, "textValue");
//Add the component and other stuff...
Code from Vaadin 8
@Getter private RichTextArea richTextArea = new RichTextArea();
private TextField textField = new TextField();
private Binder<WorkProjectValuesEntity> binder = new Binder<WorkProjectValuesEntity>(WorkProjectValuesEntity.class);
private WorkProjectValuesEntity entity;
public RichTextAreaFieldModule(){}
@Override
public Component create(WorkProjectModulesEntity moduleItem) {
this.moduleItem = moduleItem;
getWorkProjectValuesEntity(); //Retrieve values for WorkProjectValuesEntity
binder.forField(richTextArea)
.bind(WorkProjectValuesEntity::getTextValue, WorkProjectValuesEntity::setTextValue);
//For testing purpose
binder.forField(textField)
.bind(WorkProjectValuesEntity::getTextValue, WorkProjectValuesEntity::setTextValue);
binder.readBean(entity);
//Add the component and other stuff...
Am I doing something wrong or is there any problem between the Binder and the RichTextArea component??
I’ve rid of lombok annotations from both, bean and component, and still doesn’t work.
For testing, I’ve created a dummy project with a bean with lombok annotations and added a RichTextArea component to the UI and it works.
So going deeper into the project:
My project create dinamically tabs. Within those tabs I create Accordions components and within them Custom components. These custom components can be UploadFile, RichTextAreas… it depends (attached an image).
For building the components I use a Strategy Pattern… and basically what it does is:
public class ModuleAccordion extends Accordion {
@Getter @Setter private WorkProjectModulesEntity module;
public ModuleAccordion() {
setSizeFull();
}
public void addItem(WorkProjectModulesEntity moduleItem) throws ReflectiveOperationException{
FieldModuleCreatorContext context = getModuleContext(fieldType);
if(context != null){
//Here is where I create the component. In this case a RichTextAreaFieldModule
Component fieldModuleComponent = context.createComponent(moduleItem);
fieldContainer.addComponent(fieldModuleComponent);
fieldContainer.setExpandRatio(fieldModuleComponent, 1.0f);
And the RichTextAreaFieldModule code:
public class RichTextAreaFieldModule extends CustomComponent implements FieldModuleComponentCreator, FieldModuleComponentTranslator {
private VerticalLayout rootLayout = new VerticalLayout();
@Getter private WorkProjectModulesEntity moduleItem;
//Now without Lombok
private RichTextArea richTextArea = new RichTextArea();
private Binder<WorkProjectValuesEntity> binder = new Binder<WorkProjectValuesEntity>(WorkProjectValuesEntity.class);
private WorkProjectValuesEntity entity;
public RichTextAreaFieldModule(){}
@Override
public Component create(WorkProjectModulesEntity moduleItem) {
this.moduleItem = moduleItem;
//Here is where I fetch the RichTextArea value
getWorkProjectValuesEntity();
binder.forField(richTextArea)
.bind(WorkProjectValuesEntity::getTextValue, WorkProjectValuesEntity::setTextValue);
binder.readBean(entity);
this.buildComponent();
Responsive.makeResponsive(this);
setCompositionRoot(rootLayout);
rootLayout.setSizeFull();
setSizeFull();
return this;
}
I’ve making some tests and seems the problem is in the Accordion component.
When a RichtextArea component with a binder (even without the binder doesn’t work) is added into the accordion, data is not displayed although data is in the component because it can be displayed with a notification, for example.
Sorry Olli, I didn’t read your post before posting my last one.
I think the problem has nothing to do with the binder.
I’ve added vaadin 7 compatibility package to the project, and added both Vaadin 8 and Vaadin 7 RichTextArea within an accordion, and the one from Vaadin 8 shows no defaults value and the Vaadin 7 does.
So I think it’s better to close this post and start a new one in Framework UI, which I think is the right place.
I`ve pushed into github the last changes I talked about so you can try if you want.
