dataGrid/fieldGroup columns layout in tab sheet


I have a browser screen with vertical split panel and tab sheet on lower halve. The tab sheet has a data grid with more than 10 columns which update the record based on the selection in the upper data grid.
Now, the user has to scroll to the end to to see all the columns in the tab sheet grid.

I want to set the column layout something like FieldGroup with columns which allows to sets the position field.
I’ve tried to put fieldGroup in place of dataGrid in lower halve but as we know fieldGroup uses dataSource with one instance unlike collection dataSource so thats why I’m not able to update the query based on the selection in upper dataGrid.

What should I do and How can I overcome this?

Note: both the grid’s have different datasource & different entities but they are somehow related and works as expected for my use case.

Sample browser screen :
sample browser screen


Does the lower DataGrid display a single item related to the selection in the upper DataGrid? If so, take a look at the Entity combined screen template in CUBA Studio. You will get the similar result:

You can use the generated code as a foundation for further development.

Hi Gleb,

Do you mean the Entity browser/editor screen ?
Does it work for two different entities ?


I meant the Entity combined screen template. It doesn’t support two different entities, so I suggested to take a look at it just as a starting point in case you want to display some information in FieldGroup according to table’s selected row.

if you describe in more details relations between your entities (I really appreciate If you will attach a sample project) and what do you want to display in a FieldGroup, then I will be able to guide you.


I am using platform version 6.5.8 and I don’t see any Entity combined screen template.

The relation about the entities you can find in the topic here : Update column based on row selection

As you see in the lower grid there can be more columns so I just want a component similar to FieldGroup with columns as described in the sampler instead of a grid and the functionality remains the same.

So, as far as I understand, the lower DataGrid can contain more than one row (entity) loaded according to the selection from the upper DatGrid. Then in the bottom half, you want to display items vertically (similar to FieldGroup) instead of horizontally (like DatGrid or Table do). Is that correct?

EDIT: Sorry about the entity relation that I mentioned above is many-to-one which doesn’t make sense to do in this way.
Well I was asking about another screen which has one-to-one relation in this case, the selection in the upperDataGrid results in one row/record in the lower dataGrid.
And yes, that’s exactly what I want.

So, as I suggest above, you can overview the code generated by using the Entity combined screen template.

If you don’t see it, try to update CUBA Studio (not the platform version of your project).

Ok I will update the studio but again as you said earlier it doesn’t support two different entities.
Is it not possible to have a browser screen for one entity in upper grid and a editor screen for another entity in the lower grid.

You can define a datasource and set item to it every time you need to show a new item (you will see it in the generated code what I suggested). For instance, see this sample, where the item is set explicitly, like this:

private Datasource<Order> orderDs;
private Metadata metadata;

public void init(Map<String, Object> params) {
	// Datasource initialization. It is usually done automatically if the screen is
	// inherited from AbstractEditor and is used as an entity editor.
	Order order = metadata.create(Order.class);