7

私は、JSP ラッパー (各パネルに ID がないことを意味します) を使用してパネルバー (複数選択) を追加しているアプリに取り組んでおり、その中にグリッドがあります。

グリッドには、ページの上部にリスト アイテム (画像) として表示される、選択した人物に固有のデータが格納されています。

私がやりたいことは、ユーザーが人の選択を現在選択されているものから別のものに変更したときに、剣道パネルバーのすべてのパネルを折りたたむことです。ユーザーがパネルを選択/展開してデータを表示すると、イベントをキャッチし、選択した人に基づいて新しいデータソースでグリッドをリロードするため、これは新しい人のデータをリロードするのに役立ちます。

ここで意味をなすことを願っていますが、PanelBar のすべてのパネルを折りたたむ方法がわかりません。

助言がありますか？？

4

3 に答える 3

12

が の場合は、次のようにしidます。PanelBarpanel

$("#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 に答える