Add button to edit the row in the row itself in datagrid

Support
#1

I was trying to add seperate button in each row in datagrid to open the edit screen. Using the following code. But its showing like the last screenshot

    private void openEditScreen() {
        DataGrid.ButtonRenderer<StdRowPlan> gridButtonRendererFirstNameRenderer =
                getApplicationContext().getBean(DataGrid.ButtonRenderer.class);
        gridButtonRendererFirstNameRenderer.setRendererClickListener(
                clickableRendererClickEvent -> onEditStdRowPlanClick(clickableRendererClickEvent.getItem()));
        stdRowplansDataGrid.getColumn("editField").setColumnGenerator(row -> {
            Label label = uiComponents.create(Label.class);
            label.setValue("Preview");
            return label;
        });
        stdRowplansDataGrid.getColumn("editField").setCaption("EDIT");
        stdRowplansDataGrid.getColumn("editField").setRenderer(gridButtonRendererFirstNameRenderer);
    }

and in the onEditStdRowPlanClick method

    private void onEditStdRowPlanClick(StdRowPlan stdRowPlan) {
        screenBuilders.editor(StdRowPlan.class, this)
                .editEntity(stdRowPlan)
                .build()
                .show();
    }

and xml

image

But in UI its shows like [object object]
image

Any solutions

#2

Hi, in case you want to bind some custom logic. it must be done in early screen lifecycle phase hooks e.g onInit()

    @Subscribe
    protected void onInit(InitEvent event) {
        initPercentFormat();
        initRenderers();
    }

or with special annotations: @Subscribe, @Install. More info you can find at samples project:

https://demo.jmix.ru/sampler/#main/1/sample?id=datagrid-renderer