1

CollapsiblePanelExtender 似乎主要设计为响应用户鼠标事件折叠/展开事物。是否还有一种好方法可以让扩展器折叠/展开事物以响应客户端 javascript？

在我的特殊情况下，我在页面上有许多 CollapsiblePanelExtenders（及其相应的面板），我想知道是否可以通过在客户端严格执行类似的操作来实现“展开所有面板”按钮：

for each CollapsiblePanelExtender on this page, call somethingOrOther(extender)

如果我做了一个完整的回发，我可以在服务器端实现这个逻辑，但是我的页面需要很长时间才能加载，所以这似乎不会提供非常流畅的用户体验。因此，我对展开/折叠客户端感兴趣。

看起来这不是 AJAX 控制工具包人们想到的用例，但我想我会检查一下。

4

3 回答 3

1

我现在有一个部分可行的解决方案。

我按照 Ian 的建议查看了工具包源。在CollapsiblePanelBehavior.debug.js中，您expandPanel()显然可以将其作为行为的公共接口的一部分。还有一个get_Collapsed()。在 javascript 中访问这些行为的关键似乎是在 ASP.NET 中的标记BehaviorID上设置属性。CollapsiblePanelExtender

我修改了页面上的转发器，以便BehaviorIDs 是可预测的，如下所示：

<ajaxToolkit:CollapsiblePanelExtender 
    BehaviorID="<%#'collapsebehavior'+DataBinder.Eval(Container.DataItem,'id')%>"
    ID="CollapsiblePanelExtender" runat="server" />

这会导致名为collapsebehavior1、collapsebehavior2、collapsebehavior3等的行为。

完成此操作后，我可以展开客户端上的所有可折叠面板，如下所示：

function expandAll() {
    var i = 0;
    while (true) {
        i++;
        var name = 'collapsebehavior' + i;
        var theBehavior = $find(name);
        if (theBehavior) {
            var isCollapsed = theBehavior.get_Collapsed();
            if (isCollapsed) {
                theBehavior.expandPanel();
            }             
        } else {
            // No more more panels to examine
            break;
        }
    }
}

我确信$find在这样的循环中使用确实效率很低，但这就是我到目前为止所拥有的。

此外，由于某种原因，它在 Firefox 上不起作用。（在 FF 上，只有第一个元素展开，然后在 Control Toolkit 代码中出现 Javascript 错误。）

对于所有 javascript 专业人士来说，这一切看起来都非常难看。也许我稍后会收拾东西，或者你可以帮帮我。

于 2009-07-07T00:54:07.377 回答
1

在Image/button的OnClick事件中编写如下代码

<asp:Image ID="img1" runat="server" OnClick="ExpandCollapse()"/>  

function ExpandCollapse() {
    $find("collapsibleBehavior1").set_Collapsed(true);
    $find("collapsibleBehavior2").set_Collapsed(true);
}

希望这可以帮助！

于 2013-06-27T13:55:56.103 回答
0

您也可以只切换面板以在折叠/展开状态之间切换：

    function toggle() {
        var MenuCollapser = $find("name");
        MenuCollapser.togglePanel();
    }
于 2011-05-03T19:03:10.367 回答