Создать другое событие как для выбора узла, так и для удаления значка в jqtree

Question

Ниже мой код:

var nodeData = ${jsonArray}; // my json data
$('#tree1')
            .tree(
                    {
                        data : nodeData,
                        autoOpen : 1,
                        onCreateLi : function(node, $li) {                              
                            $li
                                    .find('.jqtree-element')
                                    .append(
                                            '<a href="javascript:void(0);" class="delete" data-node-id="Test"><i class="ico ico-tool-delete"></i></a>');
                        }
                    });

    $('#tree1').bind('tree.click', function(event) {
        if (event.node) {               
            var node = event.node;
            alert("edit");

        }
        $tree.on('click', '.Test', function(e) {
            alert("delete");
        });
    });

Я хочу создать другое событие при нажатии на узел и удалить значок.

В настоящее время, когда я нажимаю на узел и удаляю значок, оба генерируют одно и то же событие.

Помогите мне, какие изменения необходимы в приведенном выше коде.

Спасибо

Answer 1

Сначала вы пытаетесь выбрать элементы с class Тест, но этот класс не существует.

Также значок удаления находится внутри li элементы node, поэтому вы получаете одно и то же событие.

Попробуйте добавить удаление a элемент как это:

$('#tree1').tree({
     data : nodeData,
     autoOpen : 1,
     onCreateLi : function(node, $li) {   
          $li.append(
              '<a href="#" class="delete" data-node-id="Test"><i class="ico ico-tool-delete">Delete</i></a>');
          }
     });

проверить скрипку

Редактировать:

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

var node = $tree.tree('getNodeById', $(this).data('parent-id'));

Затем удалите этот элемент:

$tree.tree('removeNode', node);

новая скрипка