CollapsiblePanelExtender：我可以从客户端JavaScript启动折叠/展开吗？（AJAX Control Toolkit）

CollapsiblePanelExtender似乎主要是为了响应用户鼠标事件而折叠/展开事物。是否还有一种很好的方式来让扩展器崩溃/扩展响应客户端JavaScript的东西？CollapsiblePanelExtender：我可以从客户端JavaScript启动折叠/展开吗？（AJAX Control Toolkit）

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

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

如果我这样做，我可以实现这个逻辑的服务器端，而不是一个完整的回传，但我的网页需要很长的时间来加载，所以这似乎并不像它会提供一个非常漂亮的用户经验。因此，我有兴趣做展开/折叠客户端。

看起来这不是AJAX Control Toolkit人们想到的用例，但我想我会检查一下。

来源

2009-06-30 Chris

如果它原本是用javascript来完成的话，那一定是可以的。不过，我不想通过源代码翻找，所以也许发布有问题的函数？ – 2009-06-30 20:46:20

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

我遵循伊恩的建议，并浏览了工具包源代码。在CollapsiblePanelBehavior.debug.js中，你可以认为expandPanel()显然是作为行为的公共接口的一部分。还有一个get_Collapsed()。在javascript中访问这些行为的关键似乎是在ASP.NET中的CollapsiblePanelExtender标签上设置BehaviorID属性。

我修改了中继我的网页上，以便BehaviorID s为predictible，沿着这些线路：

<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 javascript专业人员来说都显得非常难看。也许我以后会清理一些东西，或者你可以帮我解决问题。

来源

2009-07-07 00:54:07 Chris

你也可以切换面板收合/展开状态之间进行切换：

function toggle() { 
     var MenuCollapser = $find("name"); 
     MenuCollapser.togglePanel(); 
    }

来源

2011-05-03 19:03:10

当然，虽然在这种情况下，我想“展开全部”，而不是“全部切换”，所以我仍然需要调用Behavior.get_Collapsed，并且仅在该条件上切换条件。 – Chris 2011-11-10 03:45:19

写下面的代码在图像的OnClick事件/按钮

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

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

希望这有助于！

来源

2013-06-27 13:55:56 Mathumitha

CollapsiblePanelExtender：我可以从客户端JavaScript启动折叠/展开吗？ （AJAX Control Toolkit）

回答

相关问题

CollapsiblePanelExtender：我可以从客户端JavaScript启动折叠/展开吗？（AJAX Control Toolkit）