DataTables：aoColumns不显示切换图像列

Question

我在我的应用上使用DataTables作为数据网格管理器。一切正常，但直到我配备了一个隐藏的行信息插件。我尝试了许多方法来改变事物，但第一列切换图像从未出现过。这是我的代码：

的Javascript

var oTable;
/* Formating function for row details */
function fnFormatDetails(nTr){
    var aData=oTable.fnGetData(nTr);
    var sOut='<table cellpadding="7" cellspacing="0" border="0" style="border:solid 1px red;padding-left:50px;">';
    sOut+='<tr><td>Renderingengine:</td><td>'+aData[2]+''+aData[3]+'</td></tr>';
    sOut+='<tr><td>Linktosource:</td><td>Couldprovidealinkhere</td></tr>';
    sOut+='<tr><td>Extrainfo:</td><td>Andanyfurtherdetailshere(imagesetc)</td></tr>';
    sOut+='</table>';
    return sOut;
}

$(document).ready(function() {
    oTable=$('#labour_show').dataTable({
        "fnDrawCallback": function(){//row highlighter
              $('table#labour_show td').bind('mouseenter', function () { $(this).parent().children().each(function(){$(this).addClass('datatablerowhighlight');}); });
              $('table#labour_show td').bind('mouseleave', function () { $(this).parent().children().each(function(){$(this).removeClass('datatablerowhighlight');}); });
        },
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "inc/_labour_show_ajax.php",                
        "aoColumns":[null,null,null,{"fnRender": function(oObj){return "<a href='main.php?do=labour&action=edit&sid=" + oObj.aData[7] + "'>Edit</a>";}  }],"aaSorting": [[1, 'asc']]
    });

    $('#labour_show tbody td img').live('click',function(){
        var nTr = this.parentNode.parentNode;
        if(this.src.match('details_close')){
            /* This row is already open - close it */
            this.src = "images/ico_expand.png";
            oTable.fnClose( nTr );
        }else{
            /* Open this row */
            this.src = "images/ico_collapse.png";
            oTable.fnOpen( nTr, fnFormatDetails(nTr), 'details' );
        }
    });
});

_labour_show_ajax.php

这是来自服务器端脚本的数组

$aColumns = array('labr_uid', 'labr_fname', 'emplyr_comp','labr_sid');

HTML代码：

<table cellpadding="0" cellspacing="0" border="0" class="display" id="labour_show">
    <thead>
        <tr>
            <th></th>
            <th>Passport</th>
            <th>Name</th>
            <th width="30%">Employer</th>           
            <th>Edit</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td colspan="5" class="dataTables_empty"><img src="images/loading.gif" /></td>
        </tr>
    </tbody>

屏幕截图

不管我试过了。第一列从未出现过。请建议。

Answer 1

我的html表中有5列，aoColumns中有4列

添加另一个空

"aoColumns":[
null,
null,
null,
null,
{"fnRender": function(oObj){return "<a href='main.php?do=labour&action=edit&sid=" + oObj.aData[7] + "'>Edit</a>";}  }],

或者执行mData并添加此

  { "mData": null ,
    "mRender" : function ( data, type, full ) {
    return '<img src="images/ico_open.png" />';}
  },

事实上，我相信mRender现在是fnRender的选择，你可以像这样替换你的fnRender

  { "mData": null , // or aAData[4] or aaData['labor_sid']
    "mRender" : function ( data, type, full ) {
    return '<a href="main.php?do=labor&action=edit&sid='+full[4]+'">Edit</a>';}
  },

这是另一个SO的链接，我回答了它Adding a link to datatables for more information

Answer 2

尝试这个，我认为你错过了其他人的{ "sClass": "" }

"aoColumns": [
                        { "sClass": "", "bSortable": false },
                        null,
                        null,
                        null,
                        { "sClass": "" },
                        { "sClass": "" },
                        {"fnRender": function(oObj){return "<a href='main.php?do=labour&action=edit&sid=" + oObj.aData[7] + "'>Edit</a>";}}
                ],