DataTable中的未定义对象

时间:2013-03-28 15:27:26

标签: javascript jquery ajax datatable

拥有数据表并使用向下钻取行。顶行填充数据,但向下钻取到附加行的链接包含一个未定义的对象,我就卡在那里。

任何帮助都会非常感激。 oData.code(undefinded)/ oData本身将返回linq查询中的所有内容,但是当我开始使用oData.etc时...对象变得未定义。即使在click事件中,我也尝试访问oData并将其放在第二个TD行中,并且它也是未定义的。

function fnFormatDetails(oTable, nTr) 
{
    var oData = oTable.fnGetData(nTr);

    var sOut =
        '<div>' +
        '<table>' +
        '<tr><td> '+oData.code+' </td><td>  </td><td> </td><td>  </td><td>  </td><td>  </td><td>  </td></tr>'
        '</table>' +
        '</div>';                           

        return sOut;
} //end fnFormatDetails function


$(document).ready(function () 
{
    var anOpen = [];
    var oTable = $('#VADataTable').dataTable(
    {
        "sDom": 'T<"clear">lfrtip',
        "oTableTools":
        {
            "sSwfPath": "/swf/copy_csv_xls_pdf.swf"
        }, //flash must be enabled
        "iDisplayLength": 5, //defalut amount of rows shown on page                
        "bServerSide": false, //uses sever for filter curently turned off                                                
        "bFilter": false, //makes columns clickable to filter 
        "bProcessing": true,
        "bserverSide":false,
        "bJQueryUI": true, //enables user interface 
        "bSort": true, //sorting for columns                               
        "bScrollInfinite": true, //using this takes away ddl of selection
        "sAjaxSource": "Data/IndustryTable",   //where ajax commands renders results                
        "sScrollY": "200px",
        "sScrollX": "100%",
        "sScrollXInner": "100%",
        "bScrollCollapse": true,
        "fnRowCallback": function (nRow, aData) 
        {
            if (aData[0] == "") 
            {
                $('td:eq(0)', nRow).html("+").addClass('control');
            }
            return nRow;
        }, //ends fnRowCallback

        "aoColumns":
        [
            { "sName": "code", "sTitle": "Code" },
            { "sName": "code" },
            { "sName": "data" },
            { "sName": "data" },
            { "sName": "data" },
            { "sName": "data" },
            { "sName": "data" }
        ]
    });

    $('#VADataTable td.control').live('click', function () 
    {
        var nTr = this.parentNode;
        var i = $.inArray(nTr, anOpen);

        if (i === -1) 
        {
            $('td').attr('+');
            var nDetailsRow = oTable.fnOpen(nTr, fnFormatDetails(oTable, nTr), 'details');
            $('div', nDetailsRow).slideDown();
            anOpen.push(nTr);
        } //end if
        else 
        {
            $('td').attr('-');
            $('div', $(nTr).next()[0]).slideUp(function () 
            {
                oTable.fnClose(nTr);
                anOpen.splice(i, 1);
            }); //ends slideUp
        } //ends else
        $('#new tr').after('<td> '+ typeof(oTable.code) +' </td>');

    }); //ends click event
} //ends live event        
)//ends ready function

1 个答案:

答案 0 :(得分:0)

我相信只需在“aoColumns”中添加“mData”属性,即数据库表的字段名称,并在“fnRowCallback”中添加您必须将“aData [0]”替换为“aData ['code']”,如下一个示例所示:

"fnRowCallback": function (nRow, aData) 
    {
        if (aData['code'] == "") 
        {
            $('td:eq(0)', nRow).html("+").addClass('control');
        }
        return nRow;
    }, //ends fnRowCallback

    "aoColumns":
    [
        { "mData" : "code", "sName": "code", "sTitle": "Code" },
        { "mData" : "code", "sName": "code" },
        { "mData" : "data", "sName": "data" },
        { "mData" : "data", "sName": "data" },
        { "mData" : "data", "sName": "data" },
        { "mData" : "data", "sName": "data" },
        { "mData" : "data", "sName": "data" }
    ]