dash-table icon indicating copy to clipboard operation
dash-table copied to clipboard

[Feature] Add interactive checkbox options in cells.

Open zach-morris opened this issue 4 years ago • 4 comments

I've checked the options for datatable interactivity, and as far as I can tell, it's possilbe to add selections on a row (row_selectable='single' | 'multi') or column basis (column_selectable='single' | 'multi' and columns[i].selectable=True). I'm looking for the ability to add a checkbox in a cell of a datatable, and further be able to utilize call backs with it.

I've attempted to work around this issue using Markdown, as markdown is supported in datatables, but it doesn't appear that the markdown checkbox is supported.

Something along the lines of this: table_checkboxes_calculated_in_confluence1

zach-morris avatar Apr 01 '21 17:04 zach-morris

Hi have you got this problem solved? I'm working on something like this too. T ^ T

ganly115 avatar Mar 31 '22 02:03 ganly115

I ended up using a dbc table and entering dbc checklist items in the cells to create a table like the one shown, then used pattern matching callbacks to capture which box(es) are checked. Try as I might, this doesn't seem to be possible with dash-table

zach-morris avatar Mar 31 '22 03:03 zach-morris

@zach-morris How did you use dbc checklist inside cells.Could you please help me ..I have got similiar scenario.

skman07 avatar Aug 03 '22 10:08 skman07

Here's an example:

import dash
from dash import html, Input, Output, ALL
import dash_bootstrap_components as dbc
import pandas as pd

df = pd.DataFrame.from_dict([{'col_{:01g}'.format(col):[dbc.Checklist(options=[{'label':'Col {:01g} Row {:01g}'.format(col,row),'value':'col_{:01g}_row_{:01g}'.format(col,row)}],id={'type':'checkboxes','index':'col_{:01g}_row_{:01g}'.format(col,row)}) for row in range(1,6)] for col in range(1,6)}])

app = dash.Dash(__name__,title='Checklist Test')

app.layout = html.Div([dbc.Table.from_dataframe(df, striped=True, bordered=True, hover=True,responsive=True),html.Div([],id='output_info')])

@app.callback(Output('output_info','children'),Input({'type': 'checkboxes', 'index': ALL}, 'value'))
def update_div(value_in):
    changed_values = [x[0] for x in value_in if isinstance(x,list) and len(x)>0]
    if len(changed_values)>0:
        return [','.join(changed_values)]
    else:
        return ['No Checkboxes']

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

Outputs: example

zach-morris avatar Aug 03 '22 19:08 zach-morris