数据表表排序应用于下一个元素

时间:2014-02-05 17:21:37

标签: jquery datatable datatables jquery-datatables

我是Jquery的新手,我正在尝试使用隐藏行的数据表。以下链接与我尝试过的相同。

http://datatables.net/release-datatables/examples/server_side/row_details.html

几乎所有东西都工作正常,数据显示在表格中,搜索正在运行。但表格排序正在应用于下一个元素,我无法打开隐藏的行。

当我点击第二列标题时,第三列正在排序。

下面是Jquery函数。

     <script>
     var oTable;

     function fnFormatDetails ( nTr )
     {
     var aData = oTable.fnGetData( nTr );
     var sOut = '<table cellpadding="5" cellspacing="0" border="0" style="padding-   left:50px;">';
     sOut += '<tr><td>Rendering engine:</td><td>'+aData[2]+' '+aData[5]+'</td></tr>';
     sOut += '<tr><td>Link to source:</td><td>Could provide a link here</td></tr>';
     sOut += '<tr><td>Extra info:</td><td>And any further details here (images etc)</td></tr>';
     sOut += '</table>';

     return sOut;
     }

     $(document).ready(function() {
     oTable = $('#hosts').dataTable( {
     "bProcessing": true,
     "bServerSide": true,
     "sAjaxSource": "server_info.php",
     "aoColumns": [
     { "sClass": "center", "bSortable": false },
     null,
     null,
     null,
     { "sClass": "center", "bSortable": false },
     { "sClass": "center", "bSortable": false }
     ]
 } );

    $('#hosts tbody td img').live( 'click', function () {
    var nTr = $(this).parents('tr')[0];
    if ( oTable.fnIsOpen(nTr) )
    {
       /* This row is already open - close it */
       this.src = "images/details_open.png";
       oTable.fnClose( nTr );
    }
    else
    {
       /* Open this row */
       this.src = "images/details_close.png";
       oTable.fnOpen( nTr, fnFormatDetails(nTr), 'details' );
    }
 } );
 } );

 </script>   

以下是server_info.php给出的Json。

     {
     "sEcho":0,
     "iTotalRecords":"2", 
     "iTotalDisplayRecords":"2",
     "aaData":[{
      "0":"",
      "1":"row1",
      "2":"123456",
      "3":"firewall",
      "4":"1",
      "5":"2014-02-05 06:11:25",
      "extra":"hrmll"
      },
      {
      "0":"",
      "1":"row2",
      "2":"567890",
      "3":"Stand",
      "4":"2",
      "5":"2014-02-05 08:14:40",
      "extra":"hrmll"
      }]
     }

任何人都可以帮忙解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

看起来你发现了一个Datatables错误。您提供的链接中的示例存在同样的问题。