Отменить выбор выбранного treenode JStree - jquery

Ситуация

Когда моя страница загружена, а мое древовидное изображение является видимым, не выбран treenode. Когда я нажимаю на node, он выбирается, по умолчанию используется.

Вопрос

Как отменить выбор node, нажав на тот же node? Поэтому я хочу нажать на выбранный node, чтобы отменить выбор. Я искал документацию. Но событие "select_node" сначала выберет node, прежде чем я смогу проверить его selectstatus.

Я знаю, что есть способ отменить node с кодом, когда я нажимаю на кнопку, но это не то, что я хочу. Я хочу щелкнуть уже выбранный node.

Может кто-нибудь мне помочь?

Ссылка (ы)

События документации JStree: http://www.jstree.com/api/#/?q=.jstree%20Event&f=enable_node.jstree

Ответы

Ответ 1

Эта проблема появилась сегодня для меня. Я ожидал хотя бы параметра конфигурации, который можно было бы установить при инициализации дерева. Хотя это не очень, это то, что я сделал, чтобы обойти проблему:

var _selectedNodeId;
$("#myTree").on("select_node.jstree", function (e, _data) {
    if ( _selectedNodeId === _data.node.id ) {
        _data.instance.deselect_node(_data.node);
        _selectedNodeId = "";
    } else {
        _selectedNodeId = _data.node.id;
    }
}).jstree();

По сути, я отслеживаю выбранный node и проверяю его на node, который был нажат. Недостатком этого метода является то, что если у вас есть обратный вызов на "changed.jstree", он срабатывает дважды, поскольку вы сначала "выбираете", а затем "отменяете", если он уже выбран.

Ответ 2

Я нашел способ включить это поведение, добавив плагин multiselect. И установите для параметра multiple параметр конфигурации false, если вам нужен один выбор:

$('#my-tree').jstree({
  core: { multiple: false },
  plugins: ['multiselect']
})

Ответ 3

Чтобы отменить выбор выбранного узла, нажмите.

$('#my-tree').('click', '.jstree-clicked', function () {
  $('#my-tree').(true).deselect_node(this);
});

Также вы можете добавить слушателя на отмене выбора.

$("#myTree").on("deselect_node.jstree", function (e, data) {
  ...
});