使用Ajax请求创建带有嵌套表的新行

我试图创建与此类似的功能：http://www.datatables.net/release-datatables/examples/api/row_details.html。使用Ajax请求创建带有嵌套表的新行

与我的代码唯一的主要区别是，我试图通过Ajax获取数据，它不起作用！

Ajax请求本身是成功的，我可以在响应中看到HTML代码。

我的JS代码：

/* Creata TableData 
--------------------------------------------*/ 
function fnFormatDetails (StreetVal, oTable, nTr) 
{ 
    var sOut = $.ajax({ 
     url: "ajax.php", 
     data: StreetVal, 
     success: function(data) { 

      console.log(data); 
      return data; 

     } 
    }); 

    return sOut; 
} 

$(document).ready(function(){ 


    $('.table-data tbody tr td a').addClass('closed'); 

    var oTable = $('.table-data').dataTable({ 
     "sPaginationType": "full_numbers", 
     "bStateSave": false, 
     "bRetrieve": true 
    }); 

    $('.table-data tbody tr td a').live('click', function (event) { 

     var StreetVal = $(this).attr('href').split('#')[1]; 
     var nTr = this.parentNode.parentNode; 

     if($(this).hasClass('closed')) { 

      $(this).removeClass('closed').addClass('open').html(' - '); 
      oTable.fnOpen(nTr, fnFormatDetails(StreetVal, oTable, nTr), 'details'); 

     } else { 

      $(this).removeClass('open').addClass('closed').html(' + '); 
      oTable.fnClose(nTr); 
     } 

     return false; 


    }); 

});

的问题是，它抛出一个错误：在jquery.dataTables.js/V的1776线

Could not convert JavaScript argument arg 0 [nsIDOMHTMLTableCellElement.appendChild] [Break On This Error] nNewCell.appendChild(mHtml);

1.8.3.dev

问题是什么？任何建议非常感谢。

来源

2011-11-21 Iladarsda

您可以通过3个论据这样fnFormatDetails？该示例只显示了两个传递的参数，oTable和nTr。 –

@Greg Pettit - 为什么不呢？我认为你可以尽可能多地传球。你不能吗？ – Iladarsda

我不知道，因此它为什么形成一个问题。但大概这个功能是按照你以规定的方式传递给它的。如果你任意地向其中添加新的东西，该函数可能不知道如何处理它。 –

实际上，返回“sOut.responseText”而不是fnFormatDetails中的sOut似乎工作。

来源

2011-11-23 10:39:42 Eugene

你能举个例子吗？ – Iladarsda

你是什么意思的例子？我将fnFormatDetails函数的最后一行更改为“return sOut.responseText;”它的工作。但在调试过程中我做到了，所以你必须为jQuery Ajax调用添加async：false来查看它的工作情况。 – Eugene

我已更新测试文件'http：// seefeld.pl/test /' - 它不再通过错误，但也不显示数据。这里复制文件：'www.seefeld.pl/test/jQuery％20DataTables％20with％20hidden％20rows.zip' – Iladarsda

它看起来像nTr是一个JS节点，而不是一个Jquery元素。你可以尝试设置NTR是这样的：

var nTr = $(this).parent("tr")[0];

此外，尝试把“异步：假”的Ajax请求调用函数之前，以确保其完成。

来源

2011-11-21 16:38:28 ZimSystem

不幸的是，这些改变的脚本返回相同的错误消息。 – Iladarsda

工作JS代码：

function fnFormatDetails (StreetVal, oTable, nTr) 
{ 
    var sOut = $.ajax({ 
     url: "ajax.php", 
     async: false, // added 
     data: StreetVal, 
     success: function(data) { 
      return data;    
     } 
    }); 

    return sOut.responseText;/changed form `return sOut` 
}

来源

2011-11-23 12:57:57 Iladarsda

使用Ajax请求创建带有嵌套表的新行

回答

相关问题