jquery - Responsive DataTables (createdRow) -


i'm using jquery datatables responsive extension (responsive: true) , following source code, works fine:

 "createdrow": function ( row, data, index ) {                 var fechafin = data[6];                 var diaactual = date();                 var datefechafin = new date(fechafin.substr(6,9)+"-"+fechafin.substr(3,2) +"-"+fechafin.substr(0,2));                   if ( data[8] != "0" ) {                        $('td', row).eq(9).html(                          "<form id=\"formmatricula_"+ $('td', row).eq(0).html()+"\" action=\"/english/inscripcionpaso1\" method=\"post\">" +                          "<button id=\"botonmatricula_"+ $('td', row).eq(0).html()+"\" type=\"submit\" class=\"btn btn-xs f-r grad-gold f-w-b\">register</button></form>"                       ); 

but when reduce size of browser button register disappears.

i think problem that, because have created it, in createdrow , line responsive: true, doesn't work button.

so included libraries are:

    <!-- datatables css 1.10.4-->     <link rel="stylesheet" type="text/css" href="${pagecontext.request.contextpath}/vendor/datatables-1.10.4/media/css/jquery.datatables.css">               <!-- jquery 1.10.4 -->     <script type="text/javascript" charset="utf8" src="${pagecontext.request.contextpath}/vendor/datatables-1.10.4/media/js/jquery.js"></script>       <!-- datatables 1.10.4 -->     <script type="text/javascript" charset="utf8" src="${pagecontext.request.contextpath}/vendor/datatables-1.10.4/media/js/jquery.datatables.js"></script>       <script type="text/javascript" charset="utf8" src="${pagecontext.request.contextpath}/publico/js/datatables.responsive.js"></script> 

i'm using jsp.

i believe issue occurs because responsive extension manipulates table structure doesn't call createdrow when adding/removing columns.

generally, not recommended use createdrow generate content cell, use columns.render instead.

with columndefs can use targets target specific column (9 in example). variable full contains data whole row.

$('#example').datatable({   "columndefs": [ {     "targets": 9,     "render": function(data, type, full, meta){        if(type === 'display'){           if ( full[8] != "0" ) {                data =                   "<form id=\"formmatricula_" +                   full[0] +                   "\" action=\"/english/inscripcionpaso1\" method=\"post\">" +                  "<button id=\"botonmatricula_" +                   full[0] +                  "\" type=\"submit\" class=\"btn btn-xs f-r grad-gold f-w-b\">register</button></form>";           }        }        return data;      }   }] }); 

Comments