I'm codign just as explained in https://editor.datatables.net/reference/api/buttons()
editor
.title( 'Create new row' )
.buttons( [
'Save',
{ label: 'Cancel', fn: function () { this.close(); } }
] )
.create();
But Save and Cancel Buttons do not appear any more.! Where is the conflict???
(function($){
$(document).ready(function() {
var editor = new $.fn.dataTable.Editor( {
ajax: 'php/table.contactos.php',
table: '#contactos',
fields: [
{
"label": "Nombre:",
"name": "contactos.nombre"
},
{
"label": "Telefono fijo:",
"name": "contactos.telefono_fijo"
},
{
"label": "Celular:",
"name": "contactos.telefono_cel"
},
{
"label": "Email:",
"name": "contactos.email"
},
{
"label": "",
"name": "contactos.cliente_id",
"def" : "0000",
type: "select"
},
{
"label": "Direccion 1",
"name": "contactos.dir_fisica_1"
},
{
"label": "Direccion 2",
"name": "contactos.dir_fisica_2"
},
{
"label": "Direccion 3",
"name": "contactos.dir_fisica_3"
}
],
//******** Inicia Lenguaje Editar
i18n: {
create: {
button: "Nuevo",
title: "Crear nuevo registro",
submit: "Crear"
},
edit: {
button: "Editar",
title: "Editar registro",
submit: "Actualizar"
},
remove: {
button: "Eliminar",
title: "Eliminar",
submit: "Eliminar",
confirm: {
_: "Está seguro de eliminar la linea %d ?",
1: "Está seguro de eliminar 1 linea?"
}
},
error: {
system: "Se ha producido un error, contactar al administrador del sistema"
},
datetime: {
previous: 'Previo',
next: 'Siguiente',
months: [ 'Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre' ],
weekdays: [ 'Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab' ]
}
}
//******** Finaliza Lenguaje Editar
} );
editor
.dependent( 'contactos.cliente_id', function ( val ) {
return val === '0' ?
{ show: ['contactos.dir_fisica_1','contactos.dir_fisica_2','contactos.dir_fisica_3'] }:
{ hide: ['contactos.dir_fisica_1','contactos.dir_fisica_2','contactos.dir_fisica_3'] } ;
} );
// Obtener el Id de la linea seleccionada y guardarla en la variable solId
var rowId = "99"; // Declarando la Variable
var solId = rowId;
var clienteNombre = "Sin Nombre";
var clienteDirFis1 ="";
var clienteDirFis2 ="";
var clienteDirFis3 ="";
var ubicacionCliente ="";
// Obteniendo el id de la linea para pasarlo por id
$('#contactos').on( 'click', 'tr', function () {
rowId = table.row( this ).id();
var largo = rowId.length;
solId = rowId.slice(4,largo);
console.log(table.row(this).data());
clienteNombre = table.row(this).data().contactos.nombre;
console.log(clienteNombre);
clienteDirFis1 = table.row(this).data().contactos.dir_fisica_1;
clienteDirFis2 = table.row(this).data().contactos.dir_fisica_2;
clienteDirFis3 = table.row(this).data().contactos.dir_fisica_3;
console.log(clienteDirFis1);
console.log(clienteDirFis2);
console.log(clienteDirFis3);
ubicacionCliente = clienteDirFis1 + ' ' + clienteDirFis2 + ' '+ clienteDirFis3;
console.log(ubicacionCliente);
} );
var table = $('#contactos').DataTable( {
"lengthMenu": [[ 5, 10, -1], [ 5, 10, "Todos"]],
"order": [[ 1, 'asc' ]],
dom: 'Blfrtip',
ajax: 'php/table.contactos.php',
columns: [
{
"data": "contactos.id"
},
{
"data": "contactos.nombre"
},
{
"data": "contactos.telefono_fijo"
},
{
"data": "contactos.telefono_cel"
},
{
"data": "contactos.email"
},
{
"data": "clientes.nombre_comercial"
},
{
"data": "contactos.dir_fisica_1"
},
{
"data": "contactos.dir_fisica_2"
},
{
"data": "contactos.dir_fisica_3"
}
],
select: true,
lengthChange: true,
buttons: [
{ extend: 'create', text: "Nuevo", editor: editor },
{ extend: 'edit', text:"Editar", editor: editor },
{ extend: 'remove', text:"Eliminar", editor: editor },
{
extend: "selectedSingle",
text: "Crear Solicitud",
action: function ( e, dt, node, config ) {
var editor = new $.fn.dataTable.Editor( {
ajax: 'php/table.solicitudes.php',
table: '#solicitudes',
fields: [
{
"label": "Cliente Nr:",
"name": "solicitudes.contacto_id",
"type" : "readonly"
},
{
"label": "Estatus:",
"name": "solicitudes.estatus",
"def": "REC",
"type" : "readonly"
},
{
"label": "Tipo Servicio:",
"name": "solicitudes.tipo_servicio",
"type": "select",
"options": [
"Diseño y Construccion",
"Acabado y Remodelaciones",
"Mtto. Correctivo",
"Limpieza",
"Mtto. Preventivo",
"Facility Management"
]
},
{
"label": "Descripcion:",
"name": "solicitudes.descripcion"
},
{
"label": "¿Urgente?",
"name": "solicitudes.urgente",
"type": "radio",
"def": "No",
"options": [
"Si",
"No"
]
},
{
"label": "Comentarios:",
"name": "solicitudes.comentarios_sol"
},
{
"label": "Contacto en sitio:",
"name": "solicitudes.contacto_sitio"
},
{
"label": "Ubicacion:",
"name": "solicitudes.ubicacion",
"type":"textarea"
},
{
"label": "Referencia:",
"name": "solicitudes.referencia"
},
{
"label": "Condiciones:",
"name": "solicitudes.condiciones"
},
{
"label": "Fecha Levantamiento:",
"name": "solicitudes.lev_fecha",
"type": "datetime",
"format": "D/MM/YY"
},
{
"label": "Hora Levantamiento",
"name": "solicitudes.lev_hora"
},
{
"label": "Fecha Cotización",
"name": "solicitudes.cot_fecha",
"type": "datetime",
"format": "D/MM/YY"
},
{
"label": "Notas Cotización:",
"name": "solicitudes.notas_cot"
},
{
"label": "Comentarios:",
"name": "solicitudes.comentarios_lev"
},
{
"label": "Archivo:",
"name": "solicitudes.archivo",
type: "upload",
display: function ( file_id ) {
return '<img src="'+table.file( 'files', file_id ).web_path+'"/>';
},
clearText: "Clear",
noImageText: 'No image'
}
],
//******** Inicia Lenguaje Editar
i18n: {
create: {
button: "Nuevo",
title: "Crear nuevo registro",
submit: "Crear"
},
edit: {
button: "Editar",
title: "Editar registro",
submit: "Actualizar"
},
remove: {
button: "Eliminar",
title: "Eliminar",
submit: "Eliminar",
confirm: {
_: "Está seguro de eliminar la linea %d ?",
1: "Está seguro de eliminar 1 linea?"
}
},
error: {
system: "Se ha producido un error, contactar al administrador del sistema"
},
datetime: {
previous: 'Previo',
next: 'Siguiente',
months: [ 'Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre' ],
weekdays: [ 'Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab' ]
}
}
//******** Finaliza Lenguaje Editar
} );
editor
.title( 'Crear Solicitud de: ' + clienteNombre )
.buttons( [
'Guardar',
{ label: 'Cancelar', fn: function () { this.close(); } } ] )
.create()
.set('solicitudes.contacto_id',solId)
.set('solicitudes.ubicacion',ubicacionCliente);
}
}
],
//******** Inicia Lenguaje Display
language: {
"decimal": "",
"emptyTable": "No hay datos disponibles en la Tabla",
"info": "Mostrando _START_ al _END_ de _TOTAL_ registros",
"infoEmpty": "Mostrando 0 de 0 de 0 registros",
"infoFiltered": "(filtrados de un total de _MAX_ registros)",
"infoPostFix": "",
"thousands": ",",
"lengthMenu": "Mostrar _MENU_ registros",
"loadingRecords": "Cargando...",
"processing": "Procesando...",
"search": "Buscar:",
"zeroRecords": "No se encontraron coincidencias",
"paginate": {
"first": "Primero",
"last": "Último",
"next": "Siguiente",
"previous": "Anterior"
},
"aria": {
"sortAscending": ": ordenar columna en orden ascendente",
"sortDescending": ": ordenar columna en orden descendente"
}
},
//******** Termina Lenguaje Display
} );
} );
}(jQuery));