Schema Length Validation Error on Python Dash DataTable

Question

I am building a dashboard using python dash and have a requirement of datatable with multiple dropdowns. The dataframe is created one with groupby (multiple columns) and aggregation. I have written the code as below:

'''

app = JupyterDash()
app.layout = html.Div(children = [html.H2('SPEND PLANNING',
             style = {'background-color':'#C0C0C0',
                      'border': '5px solid',
                      'font-family':'Serif',
                      'font-size': 25,
                      'text-align':'center',
                      'margin':'auto',
                      'justify-content': 'space-evenly',
                      'width':'100%'
                     }),
             
            html.H1(),
             
            html.Div(children = [dcc.Dropdown(
                       id ='period-filter',
                       options = dict([{"label": i, "value": i} for i in s2['PERIOD'].unique()]),
                       value = s2['PERIOD'].max(),
                       multi = True,
                       searchable=True,
                       style = {'display':'inline-block','width':'48%','vertical-align':'top'},
                       clearable=False,
                       placeholder="Quarter"
                    )]),
             
            html.H1(),
             
            html.Div(children = [dcc.Dropdown(
                       id ='commodity-filter',
                       options = dict([{"label": i, "value": i} for i in s2['COMMODITY GROUP'].unique()]),
                       value = s2['COMMODITY GROUP'].max(),
                       multi = True,
                       searchable=True,
                       style = {'display':'inline-block','width':'48%'},
                       clearable=False,
                       placeholder= "Commodity Group"
                    )]),
            
            html.H1(),
                                  
            html.Div(children = [dt(
                        id = "datatable",
                        columns = [{"name": i, "id": i} for i in s2.columns],
                        editable = True,
                        data = s2.to_dict('records'),
                        multi = True
                       ])
                                
@app.callback(output = [Output("datatable", "data")],
              inputs = [Input("period-filter", "value"),Input("commodity-filter","value")])

def display_table(comm,period):     
    filtered_df = s2.loc[(s2['COMMODITY GROUP'].eq('comm')) & (s2['PERIOD'].eq('period'))]   
    return filtered_df.to_dict('records')

if _name_ == "_main_":
    app.run_server(debug=True)
'''

The error after running the script is below:

SchemaLengthValidationError: Schema: [<Output datatable.data>] Path: () Expected length: 1 Received value of length 0: []

When I remove the [] from [Output("datatable", "data")] the error is gone, however the data in the table also disappears giving a blank table.

The dropdowns also do not show the values, instead shows only - value.

Please help me with the above.