CollapsiblePanelExtender：我可以从客户端JavaScript启动折叠/展开吗？（AJAX控制工具包）

本文介绍了CollapsiblePanelExtender：我可以从客户端JavaScript启动折叠/展开吗？（AJAX控制工具包）的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

CollapsiblePanelExtender似乎主要用于响应用户鼠标事件而折叠/展开事物。

The CollapsiblePanelExtender seems primarily designed to collapse/expand things in response to user mouse events. Is there also a good way to get the extender to collapse/expand things in response to client-side javascript?

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

In my particular case, I have a number of CollapsiblePanelExtenders (and their corresponding Panels) on a page, and I'm wondering if I could implement an "expand all panels" button by doing something like this strictly on the client side:

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

如果执行完整的回发，则可以在服务器端实现此逻辑，但是我的页面加载时间很长，因此这似乎无法提供非常流畅的用户体验。因此，我有兴趣在客户端进行扩展/折叠。

I can implement this logic server-side instead if I did a full postback, but my page takes a long time to load, and so this doesn't seem like it would provide a very slick user experience. Thus I am interested in doing expand/collapse client-side.

似乎这不是AJAX Control Toolkit使用者想到的用例，但我认为我会检查。

It seems like this isn't a use case the AJAX Control Toolkit people had in mind, but I thought I'd check.

推荐答案

我现在有部分工作的解决方案。

I have a partly working solution now.

我遵循了Ian的建议，并浏览了工具包的来源。在 CollapsiblePanelBehavior.debug.js 中，您可以看到 expandPanel（）显然是作为公共接口的一部分。行为。还有一个 get_Collapsed（）。在JavaScript中访问这些行为的关键似乎是在ASP.NET中的 CollapsiblePanelExtender 标记上设置 BehaviorID 属性。

I followed Ian's suggestion and looked through the toolkit source. In CollapsiblePanelBehavior.debug.js, you can that expandPanel() is apparently intended as part of the public interface for the behavior. There's also a get_Collapsed(). The key to accessing these behaviors in javascript seems to be setting the BehaviorID property on your CollapsiblePanelExtender tags in ASP.NET.

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

I modified the repeater on my page so that the BehaviorIDs are predictible, along these lines:

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

此结果导致行为名为 collapsebehavior1 ， collapsebehavior2 ， collapsebehavior3 等。

This results with behaviors named collapsebehavior1, collapsebehavior2, collapsebehavior3, etc..

，我可以按如下所示扩展客户端上的所有可折叠面板：

With this done, I'm able to expand all the collapsible panels on the client as follows:

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 这样的循环确实效率低下，但这就是我到目前为止的结果。

I'm sure using $find in a loop like that is really inefficient, but that's what I have so far.

此外，它没有由于某种原因无法在Firefox上运行。（在FF上，只有第一个元素会扩展，然后在Control Toolkit代码中会出现Javascript错误。）

Also, it doesn't work on Firefox for some reason. (On FF only the first element expands, and then there's a Javascript error inside the Control Toolkit code.)

对于您的所有JavaScript专业人士来说，这看起来都非常丑陋。也许我以后会收拾东西，或者您可以帮帮我。

This will all seem extremely ugly to all you javascript pros. Maybe I'll clean things up later, or you can help me out.

这篇关于CollapsiblePanelExtender：我可以从客户端JavaScript启动折叠/展开吗？（AJAX控制工具包）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

the