网格视图中的可展开和可折叠列

Question

我在 asp.net 中使用网格视图。列按这种方式排列：4月，5月，6月，Q1,7月，8月，9月，Q2,10月，11月，12月，Q3,1月，2月，3月，Q4。我想显示网格视图如下：

1. 最初，只有列 Q1、Q2、Q3、Q4 应该可见。
2. 如果我点击Q1,4月，5月，6月列应该可见。Q2，Q3，Q4仍然可见。
3. 如果我单击Q2,10月，11月，12月列应该可见。Q1，Q3，Q4仍然可见。
4. 如果我单击Q3,10月，11月，12月列应该可见。Q1，Q2，Q4仍然可见。
5. 如果我点击Q4,1月，2月，3月列应该可见。Q1，Q2，Q3仍然可见。

再次单击任何展开的列应该会像以前一样折叠它

有人指导我如何实现这一目标吗？

Answer 1

使用 jQuery。将 CssClass 应用于表示的每个列。它不必是一个有效的 css 元素，只是一个名称。

<asp:BoundField ID="Apr" CssClass="Q1" .... />

然后，您可以对包含链接的 Q1 列使用标题模板。链接的单击事件应调用一个 jQuery，该查询调用一个方法来切换hide()并show()与类匹配的元素。这将是一个函数想法：

function ToggleColumn(colID)
{
    var elements = $('.' + col);
    if (elements[0].is(":visible"))
    {
        elements.hide();
    } else {
        elements.show();
    }
    return false;
}

调用它的链接将是：

<asp:LinkButton ID="lnkQ1" OnClientClick="return ToggleColumn('Q1');" ... />

这显然需要调整以正确满足您的特定要求，并且需要在可能发生故障的地方进行一些空检查。如果您将其视为伪代码，它应该会让您朝着正确的方向前进。