How to submit client ui values to Server when mixing client widgets and ser

Hello,
I have complex dialog where I have a mix of more complex client widgets(lets call them C1, C2) and some other Serverside components S1,S2 plus server side buttons OK,CANCEL, VALIDATE which can submit dialog.
Those C1,C2 can be part of other client widgets where using RPC I can do some actions. That works when using only widgets and RPC mechanism at other place of app.
But here when I have a mix of widgets and components , when pressing Ok button, I need to have latest state on server from C1,C2, but ofcourse I have not, cause there is not RPC trigger action.

SO basically I need to call RPC on that C1 and C2 before server side Of buttons onCLick() is handled.

I tried 2 aproaches how to solve that, but both failed.

  1. Arround C1,C2 create something like SubmitableWrapper component, but I cannot reference C1,C2 connector from Wrapping connector. My connector reference is always null. (I follow doc https://vaadin.com/docs/-/part/framework/gwt/gwt-shared-state.html)

  2. Create a new button (OK) that would on client side resolve my C1,C2 by id and trigger them to cal RPC. However that resolution by element id does not work, always getting null element when using : DOM.getElementById(id)

Probably there is some other solution in Vaadin how to accomplish this.
Info : I am using Vaadin 7.7.10
Thx for help.

You need RPC to communicate back to server. From Server to Client you can simply read SharedState. Before calling RPC you need to register it. You could check this simple example of TextFieldRenderer for Grid reference how to do it. There I have similar case as you have. I need to communicate the value of the TextField to Server side via RPC.

https://github.com/vaadin/grid-renderers-collection-addon/blob/master/grid-renderers-collection-addon/src/main/java/org/vaadin/grid/cellrenderers/client/editable/TextFieldRendererConnector.java

I am attaching screenshot of my dialog.
There in center is client side widget. Above are some server side inputs and at bottom server side buttons.
From your example, looks like u trigget rpc.onChange whenever textfield changes. But that is something I want to avoid and get latest state only when pressing ok.

Note, that same Client side widget is used at other place where I use RPC cause there are only client side controls. And I also call rpc only when user triggers some client side submit button.

And here I would like to do same, avoid rpc calls on each client side input change, trigger RPC only when user press that ok botton, which is server side here.
34115.png