2017-08-24 22 views
1

コンテキストメニュー(context.menu.items)でアイテムを注文する方法はありますか? (また、サブメニュー(contextmenu.items.submenu) - もしこれがコンテキストメニューから異なる場合)。JsTree - コンテキストメニュー内のアイテムの注文

メニュー項目は、自分のコードに表示されている順序でレンダリングされません。

私は、ドキュメントでそのことについては何も見つけることができません:私は、これは一種のjstreeに見落とさすることが判明しました https://www.jstree.com/api/#/?q=contextmenu&f= $ .jstree.defaults.contextmenu.items

答えて

0

を。短い答えは、これを達成するための素晴らしい、信頼できる方法がないようです。 次のオプションがあります。

  • あなたはコンテキストメニュー項目を宣言して、標的とするブラウザはあなたに同意願っています順序を制御します。
    はい、これを試したことをお伝えしましたが、Chromeの開発ツールのコンテキストメニューではなく、コンソールに表示されている内容を正確に確認してください。 devツールで表示される順序は実際のものとは異なることがわかりました。不確かな場合は、コンテキストメニューオブジェクトの最終状態をデバッグして一時停止し、ループのfor...inを使用してそのプロパティを反復しようとします。これはjstreeの裏側でも起こります(下記参照)。
    設定が完全​​に新鮮なオブジェクトから始まる場合、または$.jstree.defaults.contextmenu.items()から取得したものを再利用して上書きする場合も、それは多くの場合、となります。プロパティ定義の順序を完全に制御するには、単純なオブジェクトリテラルから始め、必要なものを$.jstree.defaults.contextmenu.items()から必要なものを表示する順序でコピーしてください。ここではトップのカスタムメニュー項目「開く」をレンダリングする提案がある:

     
         "contextmenu": { 
          "items" : function(node) { 
           var _ctxmenu = $.jstree.defaults.contextmenu.items(); 
           var ctxmenu = { 
           "open": { 
            "label": "Open" 
            "action" function(){....}, 
            "separator_after" : true, 
           }, 
           "rename": _ctxmenu.rename, 
           "remove": _ctxmenu.remove, 
           }; 
           return ctxmenu; 
          } 
         } 
    
    我々が直接$.jstree.defaults.contextmenu.items()から取得したコンテキストメニューを使用してそれに「オープン」オブジェクトを追加した場合、それはどこかに「削除」の下にレンダリングしますそれらがすでに定義されているために名前を変更します。

  • コンテキストメニューの生成されたHTMLを後処理する。グローバルドキュメントイベント"context_parse.vakata"を購読する必要があります。
    $(document).on("context_parse.vakata", function(evt, data){ 
        //process the data.element.children('li') array 
    })
    イベントハンドラでは、グループ化とセパレータの要素を考慮して独自の並べ替えロジックを作成します。

私が言ったように、ここでは単純な順序付け/重量プロパティなどの単純な解決策はありません。

興味のある場合に備えて私たちがここにいる理由を説明する実装に関するいくつかの詳細。

$.vakata.context._parseメソッドでコンテキストメニュー生成の魔法が発生します。あなたが構築したコンテキストメニューオブジェクトを引数として取り、$.eachを使用してそのプロパティを反復します。これは、現在jstreeが依存している順序です。今これは($.eachinternally uses the for..in loopです。このループについてMDNが何を言いたいのは、iterate on enumerable properties in arbitrary orderです。だから、ブラウザが宣言の順番でこれを行うとしたら、それは仕様書で義務付けられていない幸せな偶然です。信頼性が...しかし、あなたがこれで生きることができるなら、ここで達成する方が簡単かもしれません。

このような状況の一般的な解決策は、いくつかの順序付け/重みプロパティを追加してコンテキストメニューを作成することですが、バージョン3.3.4では実装されていません。第3の選択肢は、jstreeインスタンスをパッチし、それがあなたのために実行可能な解決策であれば、これを自分自身に含めて維持することです。

+0

詳細な回答ありがとうございます。私たちはこれを必要としないように回避策を講じましたが、他の誰かがこの有用な点を見つけたらうれしいです。 –

関連する問題