Editable table
Person Name | Age | Company Name | Country | City | Remove |
---|---|---|---|---|---|
Aurelia Vega | 30 | Deepends | Spain | Madrid | |
Guerra Cortez | 45 | Insectus | USA | San Francisco | |
Guadalupe House | 26 | Isotronic | Germany | Frankfurt am Main | |
Elisa Gallagher | 31 | Portica | United Kingdom | London |
<div data-editable="true">
<div class="text-right mb-3">
<div class="btn-icon-group btn-icon-group_pill btn-air">
<button type="button" class="btn btn-info add-tr">Add Row</button>
<button type="button" class="btn btn-only-icon add-tr"><i class="la la-plus"></i></button>
</div>
</div>
<table class="table table-bordered table-responsive-md table-striped">
<tr>
<th>Person Name</th>
<th>Age</th>
<th>Company Name</th>
<th>Country</th>
<th>City</th>
<th>Remove</th>
</tr>
<tr>
<td contenteditable="true">Aurelia Vega</td>
<td contenteditable="true">30</td>
<td contenteditable="true">Deepends</td>
<td contenteditable="true">Spain</td>
<td contenteditable="true">Madrid</td>
<td>
<button type="button" class="btn btn-danger btn-pill btn-air btn-sm delete-tr">Remove</button>
</td>
</tr>
...
</table>
</div>