DashTable not showing up

I have a simple DataFrame of the 50 states that I am trying to display. The DataFrame has no column headers, and I THINK that might be part of the problem, however I’m not sure. I’ve tried several variations of the columns argument however none have worked so far. In this variation I’ve left out the argument all together.

# Create the Dash object
app = dash.Dash(__name__)

# List of all the states
state_names = ["Alabama","Alaska","Arizona","Arkansas","California","Colorado",
  "Connecticut","Delaware","Florida","Georgia","Hawaii","Idaho","Illinois",
  "Indiana","Iowa","Kansas","Kentucky","Louisiana","Maine","Maryland",
  "Massachusetts","Michigan","Minnesota","Mississippi","Missouri","Montana",
  "Nebraska","Nevada","New Hampshire","New Jersey","New Mexico","New York",
  "North Carolina","North Dakota","Ohio","Oklahoma","Oregon","Pennsylvania",
  "Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah",
  "Vermont","Virginia","Washington","West Virginia","Wisconsin","Wyoming"]

# Convert the list of states into a DataFrame
states_df = pd.DataFrame(np.reshape(state_names, (5, 10)))

# HTML Layout
app.layout = html.Div('hello', style={'textAlign': 'bottom-left'})


app.layout = dash_table.DataTable(
    id='table',
    data=states_df.to_dict("records")
)

if __name__ == '__main__':
    app.run_server(debug=True)

Hi @speeder728 and welcome to the forum!

A couple things to note:

  • All of the items in the layout must be contained within a single app.layout()
  • The columns also need to be defined in the DataTable,
  • The name and id in the column definition must be string.

Here is your example with these things included. I hope this helps!

import dash
import dash_table
import dash_html_components as html
import pandas as pd
import numpy as np


app = dash.Dash(__name__)


# List of all the states
state_names = ["Alabama","Alaska","Arizona","Arkansas","California","Colorado",
  "Connecticut","Delaware","Florida","Georgia","Hawaii","Idaho","Illinois",
  "Indiana","Iowa","Kansas","Kentucky","Louisiana","Maine","Maryland",
  "Massachusetts","Michigan","Minnesota","Mississippi","Missouri","Montana",
  "Nebraska","Nevada","New Hampshire","New Jersey","New Mexico","New York",
  "North Carolina","North Dakota","Ohio","Oklahoma","Oregon","Pennsylvania",
  "Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah",
  "Vermont","Virginia","Washington","West Virginia","Wisconsin","Wyoming"]

# Convert the list of states into a DataFrame
states_df = pd.DataFrame(np.reshape(state_names, (5, 10)))


# HTML Layout
app.layout = html.Div(
    [
        html.Div("hello", style={"textAlign": "bottom-left"}),
        dash_table.DataTable(
            id="table",
            columns=[{"name": str(i), "id": str(i)} for i in states_df.columns],
            data=states_df.to_dict("records"),
        ),
    ]
)


if __name__ == "__main__":
    app.run_server(debug=True)

@AnnMarieW My bad I meant to have one of those app.layouts commented out. This worked though. Thank you so much!!! :grin:

1 Like