Jstree показать контекстное меню условно

Question

Этот код ниже показывает мою попытку показать контекстное меню jstree только на уровне 1.

Меню отображается на первом уровне, а выбор пунктов меню показывает предупреждение. Меню не показывает на уровне 2, что хорошо, и что я хочу.

Но после выбора узла уровня 2, а затем выбора узла уровня 1 меню появляется, как и должно быть, но выбор пунктов меню ничего не делает.

Любая помощь приветствуется.

скрипка: https://jsfiddle.net/NervousElk/4p5hqg0r/17/ скрипка

document.getElementById("gobtn").addEventListener("click", buildtree);

function buildtree()
{               
        $('#ttstafftree').jstree(
        {           
        plugins: ["wholerow",  "json_data", "ui", "themes", "sort", "state",  "contextmenu"], 
        'core' : 
            {                                   
                "check_callback": true,                 
                'data' : 
                    [
                    { "id" : "ajson1", "parent" : "#", "text" : "Root 1" },
                    { "id" : "ajson1-1", "parent" : "ajson1", "text" : "a" },                       
                    { "id" : "ajson2", "parent" : "#", "text" : "Root 2" },
                    { "id" : "ajson2-1", "parent" : "ajson2", "text" : "b" },                       
                    ]
            },

            "contextmenu": 
            {                                                                               
                "items": 
                {
                  opt1: 
                  {
                    label: "opt 1",                     
                    action: function(data) 
                    {
                     alert('opt 1')                      
                    }                                                                                       
                  },

                  opt2: 
                  {
                    label: "opt 2",
                    action: function(data) 
                    {
                     alert('opt 2')                      
                    }                                                                           
                  }                                                                               
                }                
            },                      
        })  

        .on('show_contextmenu.jstree', function(e, reference, element) 
        {                           
            if ( reference.node.parents.length != 1) 
            {                             
               $('.vakata-context').remove();                          
            }

        });      
}

Answer 1

Вы удаляете элемент vakata-context, чтобы скрыть контекстное меню для конечных узлов. Хотя я не слишком уверен в этом, мне кажется, что это нарушает обработчики событий, установленные в контекстном меню, поэтому они больше не работают. Глядя на исходный код контекстного меню, jsTree внутренне использует $.vakata.context.hide(), чтобы скрыть дерево. Вы можете использовать это в своем обработчике события show_contextmenu.jstree.

.on('show_contextmenu.jstree', function (e, reference, element) {
      if (reference.node.parents.length != 1) {
          $.vakata.context.hide();
          //$('.vakata-context').css('display',"none");
      }
});