Untitled1.ipynb

{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Dash is running on http://127.0.0.1:8050/\n",
      "\n",
      " * Serving Flask app \"__main__\" (lazy loading)\n",
      " * Environment: production\n",
      "   WARNING: This is a development server. Do not use it in a production deployment.\n",
      "   Use a production WSGI server instead.\n",
      " * Debug mode: off\n"
     ]
    },
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      " * Running on http://127.0.0.1:8050/ (Press CTRL+C to quit)\n",
      "127.0.0.1 - - [29/Jul/2021 01:05:13] \"\u001b[37mGET / HTTP/1.1\u001b[0m\" 200 -\n",
      "127.0.0.1 - - [29/Jul/2021 01:05:13] \"\u001b[37mGET /_dash-layout HTTP/1.1\u001b[0m\" 200 -\n",
      "127.0.0.1 - - [29/Jul/2021 01:05:13] \"\u001b[37mGET /_dash-dependencies HTTP/1.1\u001b[0m\" 200 -\n",
      "127.0.0.1 - - [29/Jul/2021 01:05:13] \"\u001b[37mGET /_favicon.ico?v=1.20.0 HTTP/1.1\u001b[0m\" 200 -\n",
      "127.0.0.1 - - [29/Jul/2021 01:05:13] \"\u001b[37mPOST /_dash-update-component HTTP/1.1\u001b[0m\" 200 -\n",
      "127.0.0.1 - - [29/Jul/2021 01:05:13] \"\u001b[37mPOST /_dash-update-component HTTP/1.1\u001b[0m\" 200 -\n"
     ]
    },
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "[{'label': 'opt1_c', 'value': 'opt1_c'}, {'label': 'opt2_c', 'value': 'opt2_c'}, {'label': 'opt3_c', 'value': 'opt3_c'}]\n"
     ]
    }
   ],
   "source": [
    "import dash\n",
    "import dash_core_components as dcc\n",
    "import dash_html_components as html\n",
    "\n",
    "app = dash.Dash()\n",
    "\n",
    "fnameDict = {'chriddy': ['opt1_c', 'opt2_c', 'opt3_c'], 'jackp': ['opt1_j', 'opt2_j']}\n",
    "\n",
    "names = list(fnameDict.keys())\n",
    "nestedOptions = fnameDict[names[0]]\n",
    "\n",
    "app.layout = html.Div(\n",
    "    [\n",
    "        html.Div([\n",
    "        dcc.Dropdown(\n",
    "            id='name-dropdown',\n",
    "            options=[{'label':name, 'value':name} for name in names],\n",
    "            value = list(fnameDict.keys())[0]\n",
    "            ),\n",
    "            ],style={'width': '20%', 'display': 'inline-block'}),\n",
    "        html.Div([\n",
    "        dcc.Dropdown(\n",
    "            id='opt-dropdown',\n",
    "            ),\n",
    "            ],style={'width': '20%', 'display': 'inline-block'}\n",
    "        ),\n",
    "        html.Hr(),\n",
    "        html.Div(id='display-selected-values')\n",
    "    ]\n",
    ")\n",
    "\n",
    "@app.callback(\n",
    "    dash.dependencies.Output('opt-dropdown', 'options'),\n",
    "    [dash.dependencies.Input('name-dropdown', 'value')]\n",
    ")\n",
    "def update_date_dropdown(name):\n",
    "    print([{'label': i, 'value': i} for i in fnameDict[name]])\n",
    "    return [{'label': i, 'value': i} for i in fnameDict[name]]\n",
    "\n",
    "@app.callback(\n",
    "    dash.dependencies.Output('display-selected-values', 'children'),\n",
    "    [dash.dependencies.Input('opt-dropdown', 'value')])\n",
    "def set_display_children(selected_value):\n",
    "    return 'you have selected {} option'.format(selected_value)\n",
    "\n",
    "\n",
    "\n",
    "if __name__ == '__main__':\n",
    "    app.run_server()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.8.5"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}