折叠表格行

Question

我很抱歉，如果已经在别处问过这个问题，我在这里看到了一些类似于这个问题的其他问题，但我没有找到这个具体问题。

我正在使用Twitter Bootstrap 3，我有一个数据表，用户应该能够点击该行，在行下方会出现另一行表格，以允许他们添加/输入有关该行的详细信息上方。

点击后，我已成功将行折叠并展开。当行切换时，行显示正确，但一旦完成展开或折叠，尽管设置了colspan，行仍会压缩到第一列。

以下是我所谈论的图像：

在扩展开始之前：

扩张期间：

扩展完成后：

为什么会这样？我正在使用ASP.net，但除了分配可折叠容器的id并将其全部嵌套在数据转发器中之外，没有使用asp控件。我不认为ASP会成为罪魁祸首，但我不确定。

这是不可能的吗？

以下是上述示例中扩展的tr的代码：

<tr>
    <td class="collapse" id="<%# DataBinder.Eval(Container.DataItem, "ID") %>" colspan="6">
        <div class="well col-sm-12">
            <div class="form-horizontal" role="form">
                <!-- FORM CONTENTS GO HERE --!>
            </div>
        </div>
    </td>
</tr>

非常感谢任何帮助。

Answer 1

我找到了解决方案。我只是将崩溃的功能移动到tr标签而不是td标签，如下所示：

<tr class="collapse" id="<%# DataBinder.Eval(Container.DataItem, "ID") %>">
    <td colspan="6">

现在很棒！