How to populate repeating panel of data grid with a dict

Anvil Q&A
1

What I’m trying to do:
I want to assign a tuple of dicts to a repeating panel inside a data grid.
1. Assignment of 3 columns incl. Title and Data Key to a data grid:

    dict_columns = [
      { "id": "A", "title": "Application code", "data_key": "application_code"},
      { "id": "B", "title": "Short Name", "data_key": "name_short"},
      { "id": "C", "title": "Long Name", "data_key": "name_long"}
    ]
    self.data_grid.columns =  dict_columns # set columns to the data grid
  1. Creation of header components.
  2. Assignment of the data to the repeating panel & setting text to alignment=‘center’

Point 1 and 2 is working perfect, but point 3 data is not showing.

In the docs I even found the same example but it’s not showing.

Code Sample: Part responsible for the data assignment

list_dict_rows = ({'name_short': 'SST1', 'application_code': 20601, 'name_long': 'SUPER SST1 asdasd 1'},
                      {'name_short': 'SST2', 'application_code': 20602, 'name_long': 'SUPER SST1 asdasd 2'},
                      {'name_short': 'SST3', 'application_code': 20603, 'name_long': 'SUPER SST1 asdasd 3'})

    self.repeating_panel_assay.items = list_dict_rows

Clone link:
share a copy of your app

2

It sounds like you are describing the DataGridJson custom component.

1 Like
3

So there is no way to do it with the basic anvil data grid component? Populating the grid with a database was never a problem, but using code and dict’s to populate is harder than I thought.

4

Idon’t understand your question.

Dicts and database rows behave in the same way. There is no difference in how a DataGrid is used with database rows or lists of dictionaries.

That custom component uses the DataGrid. You can clone it and see how it works. Understanding how it works is not going to be easy for a beginner, please ask more specific questions if you don’t.

5

I want to assign my dict to the repeating panel of my data grid(That panel already exist). I’m getting no errors and the repeating panel of data grid stays empty. Why it’s not working?

With DataGrid.add_component(RepeatingPanel(item=list_dict_rows) I was able add a new Repeating panel with data displayed, but I am not able to fill the existing one in data grid. I’ve missed there something.

list_dict_rows = ({'name_short': 'SST1', 'application_code': 20601, 'name_long': 'SUPER SST1 asdasd 1'},
                      {'name_short': 'SST2', 'application_code': 20602, 'name_long': 'SUPER SST1 asdasd 2'},
                      {'name_short': 'SST3', 'application_code': 20603, 'name_long': 'SUPER SST1 asdasd 3'})

    self.repeating_panel_assay.items = list_dict_rows

I’ve checked your Custom Componen and understand almost everything in it. I want just to find out what I’ve missed, that the data is now showing in the repeating panel.

I could solve it probably by adding Label components for each row, similar approach like the headers rows.

6

The repeating panel row template must be setup for the fields you want to display. Your repeating panel row template is empty.

The component Stefano linked to dynamically creates the row template based on the fields. You could certainly do the same if you wanted.

1 Like
7

What is the part that you want to do at design time and what is the part that you want to do at run time?

The DataGridJson does all at runtime, reading the list of columns from one list of dictionaries and the content from another list.

Is it the same in your case?
Or do you have the DataGrid already setup with the correct columns?

8

Ok. Now I understand. I will try to implement it with the custom component from Stefano. I need that flexible way for my Grid. Thank you both for the patience with my questions🙂