javascript - personalizar - propiedades datatable jquery
No se pueden editar/crear/eliminar elementos en la tabla usando Datatables y editor gratuito (1)
dataTables.altEditor.free.js
el código en dataTables.altEditor.free.js
y vi que realmente debería usar una matriz de matrices como datos o no funcionaría. Entonces hay dos formas para usted:
- reescribe algunas partes de
dataTables.altEditor.free.js
- reestructurar sus datos como está aquí: http://jsfiddle.net/rmcmaster/bbLjzspf/22/
Estoy intentando construir una tabla editable con datos en formato JSON desde una llamada AJAX. Para esto estoy usando el complemento Datatables junto con el Free Datatables Editor (kingkode.com/free-datatables-editor-alternative/). No puedo usar el Editor de tablas de datos porque solo puedo usar bibliotecas que son de código abierto.
Por el momento, solo estoy usando mi propio servidor simpleHTTP para proporcionar el JSON, que es el motivo por el que el enlace apunta a localhost.
La tabla muestra los datos correctos inicialmente, pero no puedo editar / crear / eliminar ninguno de los elementos, ya que el valor de la fila seleccionada parece no estar definido y proporciona un error al confirmar / enviar.
Imágenes de errores:
Eliminar: parece que el valor no está definido
No entiendo lo que me estoy perdiendo o lo que estoy haciendo mal, así que cualquier ayuda que pueda llevarme por el buen camino sería genial.
Guión:
$(document).ready(function() {
var columnDefs = [{
title: "NTP Servers",
data: "ntp_server"
}];
//Table creation
var myTable = $(''#testTableData'').dataTable({
"ajax": "http://localhost:6112/data.php",
columns: columnDefs,
dom: ''Bfrltip'',
select: ''single'',
responsive: true,
altEditor: true,
buttons: [{
text: ''Create'',
name: ''add''
},
{
extend: ''selected'',
text: ''Edit'',
name: ''edit''
},
{
extend: ''selected'',
text: ''Delete'',
name: ''delete''
},]
});
});
HTML:
<form id="fe">
<div class="container">
<h1>Data Table - Network/Time</h1>
<table class="dataTable table table-striped" id="testTableData">
</table>
</div>
</form>
Ejemplo de datos JSON:
{
"data": [{
"DT_RowId": 0,
"ntp_server": "1.openwrt.pool.ntp.org"
}, {
"DT_RowId": 1,
"ntp_server": "2.openwrt.pool.ntp.org"
}, {
"DT_RowId": 2,
"ntp_server": "3.openwrt.pool.ntp.org"
}]
}
Las bibliotecas que he incluido:
<script src="libs/js/jquery.js"></script>
<script src="libs/js/bootstrap.min.js"></script>
<script src="libs/js/jquery.dataTables.min.js"></script>
<script src="libs/js/dataTables.bootstrap.min.js"></script>
<script src="libs/Buttons-1.2.2/js/dataTables.buttons.min.js"></script>
<script src="libs/Buttons-1.2.2/js/buttons.bootstrap.min.js"></script>
<script src="libs/Select-1.2.0/js/dataTables.select.min.js"></script>
<script src="libs/js/altEditor/dataTables.altEditor.free.js"></script>