7

我正在开发一个应用程序,我正在使用 JSP Wrapper 添加面板栏(多选)(这意味着每个面板都没有 ID),并且在其中有网格。

网格存储特定于所选人员的数据,这些人员在页面顶部显示为列表项(图像)。

我想要做的是,当用户将人员的选择从当前选择更改为另一个时,折叠剑道面板栏的所有面板。这将有助于重新加载新人的数据,因为当用户选择/展开面板以查看数据时,我会捕获事件并根据所选人员使用新的数据源重新加载网格。

我希望我在这里有意义,但我不确定如何折叠 PanelBar 的所有面板。

有什么建议么??

4

3 回答 3

12

如果id您的PanelBaris panel,请执行以下操作:

$("#panel").data("kendoPanelBar").collapse($("li", "#panelbar"));

或者

var panelbar = $("#panelbar").data("kendoPanelBar");
panelbar.collapse($("li", panelbar.element));

即我们将collapse每个li元素都放在#panelbar.

编辑:如果要删除选择,请添加:

$(".k-state-selected", panelbar.element).removeClass("k-state-selected");
于 2013-05-10T00:37:45.730 回答
1

HTML

  <ul id="palettePanelBar">
            <li id="item1" class="k-state-active">
               <!--Some Data-->
            </li>
            <li id="item2">
               <!--Some Data for second item-->

            </li>
 </ul>

Javascript

 var panelBar = $("#palettePanelBar").data("kendoPanelBar");
    panelBar.expand($('[id^="item"]'));
于 2014-09-09T04:34:18.713 回答
0

您可以使用此块折叠所有面板,作为答案的奖励,您可以通过这种方式仅展开选定的面板:

var panelBar =  $("#importCvPanelbar").data("kendoPanelBar");
            panelBar.collapse($("li"));// will collapse all panel item
            panelBar.bind("select", function(e) {
                var itemId = $(e.item)[0].id;

                panelBar.expand(itemId);// will expand the selected one
            });
于 2017-01-09T12:32:56.130 回答