# Add a blank row at the bottom of the table on clicking a button

**URL:** <https://community.plotly.com/t/add-a-blank-row-at-the-bottom-of-the-table-on-clicking-a-button/10871>\
**Category:** Dash Python\
**Created:** [June 12, 2018, 4:13pm UTC](https://community.plotly.com/t/add-a-blank-row-at-the-bottom-of-the-table-on-clicking-a-button/10871 "2018-06-12T16:13:01Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![syntaxError](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/syntaxerror/32/3368_2.png) [@syntaxError](https://community.plotly.com/u/syntaxError)\
**Post date:** [June 12, 2018, 4:13pm UTC](https://community.plotly.com/t/add-a-blank-row-at-the-bottom-of-the-table-on-clicking-a-button/10871/1 "2018-06-12T16:13:01Z")

</div>

Can we do something where the user can add a `blank row` at the `bottom` of the `existing table` when he clicks the button. Is it possible.

---

<div class="post-metadata">

**Author:** ![zhanghuanhuan](https://avatars.discourse-cdn.com/v4/letter/z/a88e4f/32.png) [@zhanghuanhuan](https://community.plotly.com/u/zhanghuanhuan)\
**Post date:** [June 13, 2018, 6:45am UTC](https://community.plotly.com/t/add-a-blank-row-at-the-bottom-of-the-table-on-clicking-a-button/10871/2 "2018-06-13T06:45:22Z")

</div>

I also have this problem. Do you solve this problem?

---

<div class="post-metadata">

**Author:** ![syntaxError](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/syntaxerror/32/3368_2.png) [@syntaxError](https://community.plotly.com/u/syntaxError)\
**Post date:** [June 13, 2018, 7:51am UTC](https://community.plotly.com/t/add-a-blank-row-at-the-bottom-of-the-table-on-clicking-a-button/10871/3 "2018-06-13T07:51:16Z")

</div>

I could able to do only for once, and when clicking the button next time, nothing has changed. I want to add rows according to the number of clicks that happen.

`Like, if I click once, one row should get added irrespective of headings. And likewise, it should repeat the same for the next click.`

Also I tried giving a loop (thought it would work), but the heading is getting added and at one click all the rows are adding up as per the given range and it is very annoying.

---

<div class="post-metadata">

**Author:** ![zhanghuanhuan](https://avatars.discourse-cdn.com/v4/letter/z/a88e4f/32.png) [@zhanghuanhuan](https://community.plotly.com/u/zhanghuanhuan)\
**Post date:** [June 14, 2018, 12:15am UTC](https://community.plotly.com/t/add-a-blank-row-at-the-bottom-of-the-table-on-clicking-a-button/10871/4 "2018-06-14T00:15:17Z")

</div>

can you show me your code about adding row, thank you very much!

---

<div class="post-metadata">

**Author:** ![syntaxError](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/syntaxerror/32/3368_2.png) [@syntaxError](https://community.plotly.com/u/syntaxError)\
**Post date:** [June 14, 2018, 12:33pm UTC](https://community.plotly.com/t/add-a-blank-row-at-the-bottom-of-the-table-on-clicking-a-button/10871/5 "2018-06-14T12:33:40Z")

</div>

```
import dash
import pandas as pd
import dash_core_components as dcc
import dash_html_components as html
import dash_table_experiments as dt
from dash.dependencies import Output, Input

app = dash.Dash( __name__ )

fields = ['date', 'time']

df = pd.DataFrame()
for i in fields:
	df[i] = ''

app.layout = html.Div([
	html.Button(id='button', n_clicks=0, children='Add Fields'),
	html.Div(id='content'),
	html.Div(dt.DataTable(rows=[{}]), style={'display' : 'none'})
])

@app.callback(
	Output('content', 'children'),
	[Input('button', 'n_clicks')]
)
def display_row(n_clicks):
	add_table = []
	add_index = []
	click = 0
	repeat = 1
	if n_clicks > 0:
		add_table.append(
			html.Div([
				html.Div(id='datatable-output'),
				dt.DataTable(
					id='datatable',
					rows=[{fields[0] : '', fields[1] : ''}],
				)
			])
		)
	return add_table
if __name__ == ' __main__':
	app.run_server(debug=True)

```

This just adds one row along with headings.

---

<div class="post-metadata">

**Author:** ![zhanghuanhuan](https://avatars.discourse-cdn.com/v4/letter/z/a88e4f/32.png) [@zhanghuanhuan](https://community.plotly.com/u/zhanghuanhuan)\
**Post date:** [June 20, 2018, 5:44am UTC](https://community.plotly.com/t/add-a-blank-row-at-the-bottom-of-the-table-on-clicking-a-button/10871/6 "2018-06-20T05:44:21Z")

</div>

Thank you very much! It is of great use to me.
