datetimepicker in datatables OK, but with TABS failed

nextart

Hi all i'm newbie on this forum, but here my first question.
if i have one datatables in my page .php i can use datatimepicker (https://getdatepicker.com/4/) in it

but if i add tabs on the tables the datatimepicker stops working and i receive in console this error message

Uncaught TypeError: input.size is not a function
    at dateTimePicker (bootstrap-datetimepicker.js:2504)
    at HTMLButtonElement.<anonymous> (bootstrap-datetimepicker.js:2562)
    at Function.each (jquery-3.2.1.min.js:2)
    at r.fn.init.each (jquery-3.2.1.min.js:2)
    at r.fn.init.$.fn.datetimepicker (bootstrap-datetimepicker.js:2557)
    at HTMLInputElement.<anonymous> (invia_cds.php:1248)
    at HTMLDocument.dispatch (jquery-3.2.1.min.js:3)
    at HTMLDocument.q.handle (jquery-3.2.1.min.js:3)

i attach calendar to input with class="data_ricezione_contratto_ged" with this code

 $('#datatables_rinnovi_ipad').on('draw.dt', function () { 
    $(".data_ricezione_contratto_ged").datetimepicker({
        format: 'DD-MM-YYYY',
        useCurrent: false,
        showClear: true,
        locale: moment.locale('it'),
        //debug: true,
        tooltips:    {
                        selectMonth: 'Seleziona il Mese',
                        prevMonth: 'Mese Precedente',
                        nextMonth: 'Mese Successivo',
                        selectYear: 'Seleziona Anno',
                        prevYear: 'Anno precedente',
                        nextYear: 'Anno successivo',
                        selectDecade: 'Select Decade',
                        prevDecade: 'Previous Decade',
                        nextDecade: 'Next Decade',
                        prevCentury: 'Previous Century',
                        nextCentury: 'Next Century'
                    }
    });
});

datatables instance

var tab_rinnovi_ipad = $('#datatables_rinnovi_ipad').DataTable( {
            "pagingType": "full_numbers",
            "lengthMenu": [
                [ 15, 25, 50, -1],
                [ 15, 25, 50, "All"]
            ],
            "columnDefs": [
                {
                    "targets": [0,1,2,4,5,6],//"_all",// [0,6,7], // your case first column
                    "className": "text-center"
                    //"width": "4%"
               } 
            ],
            /*scrollY:        445,
            scrollCollapse: true,*/
            ordering: false,
            select:true,
            "processing": true,
            "ajax": "assets/ajax/estrai_dati.php?label=CDS_IPAD_RIN",       
            "columns": [
            
              { data: 'id' },
              { data: 'codice_fa',
                "render": function ( data, type, row, meta ) {
                    return '<a href="#" class="datirinnovofa btn btn-info btn-xs" data-id="'+row['id']+'" data-toggle="tooltip" title="Recupera dati FA">'+data+'</a>';
                }
            } ,
             { data: 'codice_sblocco' },
              { data: 'cognome_nome' },
              { data: 'data_ricezione_contratto_ged' ,
              "render": function ( data, type, row, meta ) {

/* HERE THE INPUT WITH CALENDAR ATTACHED*/

                if (!row['data_ricezione_contratto_ged']) {
                    return '<input type="text" data-id="" class="form-control centrato data_ricezione_contratto_ged" placeholder="" />';
                    } else {
                    return '<input type="text" data-id="" class="form-control centrato data_ricezione_contratto_ged" placeholder="" value="'+data+'" />';**
                                        
                }                           
                }
              }, 
              { "data": 'data_invio_cds' ,
                "render": function ( data, type, row, meta ) {
                    if (!row['data_invio_cds']){
                        var today = new Date();
                        var dd = today.getDate();
                        var mm = today.getMonth()+1; 
                        var yyyy = today.getFullYear();
                    if(dd<10) 
                    {
                        dd='0'+dd;
                    } 

                    if(mm<10) 
                    {
                        mm='0'+mm;
                    } 
                    today = yyyy+''+mm+''+dd;
                    //console.log(today); 
                        return '<button type="button" class="btn btn-warning btn-xs data_invio_cds" data-id="'+row['id']+','+today+'" data-toggle="tooltip" title="Salva la data"><span class="material-icons">save</span></button>';
                    } else {
                    return data;
                                }
                }               
              } ,
              //{ "data": 'data_remove_old_device' } ,
              { "data": 'data_ricezione_contratto_email' , 
              "render": function ( data, type, row, meta ) {
                    if (!row['data_ricezione_contratto_email']){
                        var today = new Date();
                        var dd = today.getDate();
                        var mm = today.getMonth()+1; 
                        var yyyy = today.getFullYear();
                    if(dd<10) 
                    {
                        dd='0'+dd;
                    } 

                    if(mm<10) 
                    {
                        mm='0'+mm;
                    } 
                    today = yyyy+''+mm+''+dd;
                    //console.log(today);
                        return '<button type="button" class="btn btn-warning btn-xs data_ricezione_contratto_email" data-id="'+row['id']+','+today+'" data-toggle="tooltip" title="Salva la data"><span class="material-icons">save</span></button>';
                    } else {
                    return data;
                                }
                }               
              }/*,
              { "data": 'data_invio_sollecito_contratto' } */
            ],
        language: {
            
            searchPlaceholder: "Cerca nella tabella..",         
            emptyTable: "Non sono presenti dati da caricare",
            info: "Visualizzati da _START_ a _END_ di _TOTAL_ record",
            infoEmpty:"Visualizazzati 0 di 0 di 0 record",
            infoFiltered:"(filtrati da _MAX_ record totali)",
            infoPostFix:"",
            lengthMenu: "Mostra _MENU_ righe",
            loadingRecords: "Caricamento...",
            processing:     "Analizzando i dati...",
            search: "_INPUT_",
            zeroRecords: "Nessun dato presente per i parametri di ricerca.",
            paginate: {
                    first:      "Prima",
                    last:       "Ultima",
                    next:       "Successiva",
                    previous:   "Precedente"
            },
        }
});

someone use datetimepicker with datatables?

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin