DataTables-在不使用Ajax的情况下展开子级详细信息 [英] DataTables - Expand Child details without using Ajax
问题描述
我正在使用jquery DataTables(版本1.10)的页面上工作. TableData源当前仅作为呈现页面上的HTML表发送,并且可以完美运行.但是,我希望能够扩展行以显示详细信息.
I'm working on a page that uses jquery DataTables (version 1.10). The TableData source is currently being sent as just an HTML table on the rendered page, and works perfect. However I want to be able to expand the rows to show detailed information.
非常类似于示例此处
但是,我正在使用的网站目前尚未设置任何Web服务,因此,我将无法进行Ajax调用来获取示例所使用的扩展信息.
However, the site I'm working with currently does not have any sort of web services set up on it yet, so I won't be able to make ajax calls to get the expanded information like the example uses.
有没有办法在完全渲染的页面上提供有关父子关系的所有必要信息?
Is there a way I can supply all of the necessary information for the parent child relationship on a fully rendered page?
我可以以某种方式嵌套表数据以获取此数据,还是告诉DataTables使每隔一个表行成为其上一个的子表?
Can I somehow nest the table data to get this, or tell DataTables to make every other table row a child of the one above it?
我在datatables论坛上发布了相同的问题:问题
I posted this same question on the datatables forums: Question
推荐答案
您可以将子行的数据存储在父行的data
属性中,并相应地更改示例中的format
方法.像
You can store the data for the child row in a data
attribute of the parent row and change the format
method from the example accordingly. Something like
在您的HTML中:
<tr data-child-name="test1" data-child-value="10">
<td>ParentRow</td>
<td>No. 1</td>
</tr>
在click
处理程序中(示例中的第50行):
In the click
handler (line 50 from the example):
row.child(format(tr.data('child-name'), tr.data('child-value'))).show();
和format
方法一样:
function format (name, value) {
return '<div>Name: ' + name + '<br />Value: ' + value + '</div>';
}
这篇关于DataTables-在不使用Ajax的情况下展开子级详细信息的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!