Black Lives Matter. Please consider donating to Black Girls Code today.

Can't sort or filter with the new Data Table component in a multipage app

I have a Data Table in one page of my multi-page app layout:

  ... preceding code
    html.Div([
        dcc.Dropdown(
            id='dropdown',
            options=[{'label': name, 'value': name} for name in another_variable]
        )
    ]),
    html.Div(children=[
        html.Div(
            id='table-container', 
            className="twelve columns",
            children=[
                dash_table.DataTable(
                    id='table',
                    columns=[{"name": i, "id": i} for i in mip_solr.search('*:*',rows=1).docs[0].keys()],
                    data=[{}],
                    sorting=True,
                    sorting_type="multi",
                    filtering=True
                )
            ]
        )
    more code...

and this callback

    @app.callback(
        Output('table', 'data'),
        [Input('dropdown', 'value')]
    )
    def my_data_table(dropdown_value):
        results = mip_solr.search('*:*',**{
            "fq":[f"PS:\"{dropdown_value}\""],
            "rows":"100"
        })

        return [result for result in results]

Tables successfully updates, but I cant’ sort or filter even though I have those options enabled. Any ideas?

1 Like

Just to add something on Filtering. I am going through DataTable - Python Callbacks. Filtering doesn’t seem to be working in any Backend Paging with Filtering examples. It says Enter eq Asia in the "continent" column but when I do that nothing happens. Am I missing something?

Hi @alim, did you press enter/return afterwards? It works for me.

Yes, I did. The filter just turns red and nothing else. I will give it another try later from my home computer.
image

You need to enter “eq Asia”, not “Asia”

1 Like

Oh that makes sense. Now it works. I thought eq was eg as in for example. Thanks :slight_smile: