向下钻取行详细信息中的NaN - DataTables

时间:2011-11-26 11:49:51

标签: php javascript jquery ajax datatables

如果有帮助,我会使用点火版本。我有一切设置很好但是,在底部的行详细信息中有一个NaN检查此图像,看看我的意思。

enter image description here

这是我的代码,提前感谢任何帮助。

    $(document).ready(function()
      {
        var anOpen = [];
        var oTable = $('#example').dataTable
        ({
              'bProcessing': true,
              'aaSorting': [[1,'asc']], // sorts date by default.
              'iDisplayLength': 10,
              'bJQueryUI': true,
              'bServerSide': true,
              'sAjaxSource': 'ajax/pc-ajax-table.php',
              'fnServerData': function(sSource, aoData, fnCallback)
          {

              aoData.push( { "name": "from_date", "value": $( "#from" ).val() },
                           { "name": "to_date", "value": $( "#to" ).val() } );
            $.ajax
                ({
                  'dataType': 'json',
                  'type'    : 'POST',
                  'url'     : sSource,
                  'data'    : aoData,
                  'success' : fnCallback
                });
          },
               'aoColumns':[
              {"bVisible": false, "bSortable": false, "bSearchable": true}, 
              {"fnRender": format_ddmmyyyy}, // renders the date as dd/mm/yyyy
              null,  // name
              null,  // lead location
              null, // course type
              {"bVisible": false, "bSortable": false, "bSearchable": true},
              {"bVisible": false, "bSortable": false, "bSearchable": true},
              {"bVisible": false, "bSortable": false, "bSearchable": true},
              {"bVisible": false, "bSortable": false, "bSearchable": true},
              null,
              null,
              {"sClass": "control", "bSortable": false, "bSearchable": false},
              {"bSortable": false, "bSearchable": false},
              {"bSortable": false, "bSearchable": false}]
        });
        // for adding a details box
    $('#example td.control').live( 'click', function () {
      var nTr = this.parentNode;
      var i = $.inArray( nTr, anOpen );

      if ( i === -1 ) {
        $('img', this).attr( 'src', "../images/details_close.png" );
        var nDetailsRow = oTable.fnOpen( nTr, fnFormatDetails(oTable, nTr), 'details' );
        $('div.innerDetails', nDetailsRow).slideDown();
        anOpen.push( nTr );
      }
      else {
        $('img', this).attr( 'src', "../images/details_open.png" );
        $('div.innerDetails', $(nTr).next()[0]).slideUp( function () {
          oTable.fnClose( nTr );
          anOpen.splice( i, 1 );
        } );
      }
    } );

    function fnFormatDetails( oTable, nTr )
    {
      var oData = oTable.fnGetData( nTr );
      var sOut =
        '<div class="innerDetails">'+
          '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:20px;">'+
            '<tr><td width="150">Date Asked:</td><td>'+oData[1]+'</td></tr>'+
            '<tr><td>Lead Name:</td><td>'+oData[2]+'</td></tr>'+
            '<tr><td>Lead Location:</td><td>'+oData[3]+'</td></tr>'+
            '<tr><td>Course Type:</td><td>'+oData[4]+'</td></tr>'+
            '<tr><td>Client:</td><td>'+oData[5]+'</td></tr>'+
            '<tr><td>Course Location:</td><td>'+oData[6]+'</td></tr>'+
            '<tr><td>Course Location:</td><td>'+oData[7]+'</td></tr>'+
            '<tr><td>Course Location:</td><td>'+oData[8]+'</td></tr>'+
            '<tr><td>Course Location:</td><td>'+oData[9]+'</td></tr>'+
            '<tr><td>Course Location:</td><td>'+oData[10]+'</td></tr>'+
            '<tr><td>Lead ID:</td><td>'+oData[0]+'</td></tr>'+
          '</table>'+
        +'</div>';
      return sOut;
    }

1 个答案:

答案 0 :(得分:5)

有两个+ +混淆你的代码

     '</table>'+
    +'</div>';
 return sOut;

在标签前取一个加号,希望你的NaN会消失