Question

我正在使用带有响应式扩展（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。

Answer 1

我认为问题出现是因为自适应扩展操纵了表格结构，但在添加/删除列时却没有调用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;
     }
  }]
});

响应式DataTables（createdRow）

1 个答案: