https://github.com/krescruz/datatable-inline
Simple datatable plugin for edit row data inline
https://github.com/krescruz/datatable-inline
datatables-plugin javascript
Last synced: about 1 month ago
JSON representation
Simple datatable plugin for edit row data inline
- Host: GitHub
- URL: https://github.com/krescruz/datatable-inline
- Owner: krescruz
- License: mit
- Created: 2017-07-28T21:40:07.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2017-07-28T22:25:27.000Z (almost 9 years ago)
- Last Synced: 2025-07-23T07:32:02.773Z (11 months ago)
- Topics: datatables-plugin, javascript
- Language: JavaScript
- Size: 5.86 KB
- Stars: 4
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Datatable-inline simple inline editing
Simple plugin datatable for https://datatables.net/
## Installation
In a browser:
```html
```
## Usage and config
```js
var dataInline = window.DataTableInline;
var myDatatable = $('myTable').DataTable({ 'columns': getColumns() });
// Config Datatable inline
dataInline.setConfig({
'datatable': myDatatable,
'editCols': ['name', 'lastname']
});
// Define columns for your DataTable
function getColumns() {
var columns = [
{ 'data': 'id' },
{ 'data': 'name', className: 'col-name' },
{ 'data': 'lastname', className: 'col-lastname' }
];
// Important Add buttons actions
columns.push(dataInline.getColumnAction());
return columns;
}
// Define you actions
function onClickSave(event) {
dataInline.preSaveAction(event).then(function(data) {
console.log("Do something", data);
});
}
function onClickDelete(event) {
dataInline.preDeleteAction(event).then(function(data) {
console.log("Do something", data);
});
}
/**
* Define events
*/
datatable.on('click', '.dt-inline-btn-edit', dataInline.editAction);
datatable.on('click', '.dt-inline-btn-save', onClickSave);
datatable.on('click', '.dt-inline-btn-delete', onClickDelete);
```