jquery - 响应式数据表(createdRow)

我正在使用具有响应式扩展（responsive: true）和以下源代码的jQuery DataTables，它工作正常：

 "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>"
                      );

但是，当我减小浏览器的大小时，REGISTER按钮消失了。

我认为问题在于，因为我已经在createdRow和responsive: true行中创建了该按钮，因此不适用于此按钮。

因此，包含的库为：
    
        
        

    <!-- 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>

我正在使用JSP。

最佳答案

我相信会发生此问题，因为响应扩展可操纵表结构，但在添加/删除列时不会调用createdRow。

通常，不建议使用createdRow为单元格生成内容，而应使用columns.render。

使用columnDefs，您可以使用targets定位特定列（在示例中为9）。变量full包含整个行的数据。

$('#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;
     }
  }]
});