xxxxxxxxxx1
<div class="d-flex justify-content-end mb-4">2
<div class="form-outline">3
<input4
data-mdb-search5
data-mdb-target="#table_modal"6
type="text"7
id="search_modal"8
class="form-control"9
/>10
<label class="form-label" for="search_modal">Search</label>11
</div>12
<button class="btn btn-primary btn-sm ms-3" data-mdb-add-entry data-mdb-target="#table_modal">13
<i class="fa fa-plus"></i>14
</button>15
</div>16
<hr />17
<div id="table_modal"></div>1
1
xxxxxxxxxx1
const advancedColumns = [2
{3
width: 250,4
label: 'Company',5
field: 'company',6
},7
{8
width: 250,9
sort: false,10
defaultValue: 'Warsaw',11
options: ['London', 'Warsaw', 'New York'],12
inputType: 'select',13
label: 'Office',14
field: 'office',15
},16
{17
width: 250,18
inputType: 'number',19
defaultValue: 1,20
label: 'Employees',21
field: 'employees',22
editable: false,23
},24
{25
width: 100,26
defaultValue: false,27
inputType: 'checkbox',28
label: 'International',29
field: 'international',30
},31
];32
33
const advancedRows = [34
{35
company: 'Smith & Johnson',36
office: 'London',37
employees: 30,38
international: true,39
},40
{41
company: 'P.J. Company',42
office: 'London',43
employees: 80,44
international: false,45
},46
{47
company: 'Food & Wine',48
office: 'London',49
employees: 12,50
international: false,51
},52
{53
company: 'IT Service',54
office: 'London',55
employees: 17,56
international: false,57
},58
{59
company: 'A. Jonson Gallery',60
office: 'London',61
employees: 4,62
international: false,63
},64
{65
company: 'F.A. Architects',66
office: 'London',67
employees: 4,68
international: false,69
},70
];71
72
const tableModal = new TableEditor(73
document.getElementById('table_modal'),74
{75
columns: advancedColumns,76
rows: advancedRows,77
},78
{ mode: 'modal', entries: 5, entriesOptions: [5, 10, 15] }79
); Console errors: 0