jstree dnd плагин - предотвратить движение после падения? - PullRequest
0 голосов
/ 09 июня 2018

Мне нужно выполнить ajax-вызов после того, как пользователь переместит узел в jsTree с помощью плагина dnd.Если этот вызов ajax возвращает ошибку, мне нужно либо предотвратить перемещение, либо полностью изменить действие.Из прослушивателя событий move_node есть ли способ сообщить плагину dnd отменить сброс или как-то отменить действие?Я попытался вернуть false и установить e.preventDefault() и e.stopImmediatePropagation(), но, похоже, ничего не работает.

$($tree).jstree({
    core: {
        data: $treeData,
        check_callback: function (op, node, parent, position, more) {
            switch (op) {
                case 'move_node':
                    // moveNode() validates the move based on
                    // some data stored in each node, but doesn't
                    // (and shouldn't) make an ajax call to determine
                    // if the node *actually can* be moved
                    return moveNode(node, parent, position, more);
            }
        }
    },
    plugins: ['dnd']
}).on('move_node.jstree', function(e, data) {
    // moveNode() returned true and the user moved the node
    if (!doMoveNode(data)) {
        // none of this works!!
        e.preventDefault();
        e.stopImmediatePropagation();
        return false;
    }
});

1 Ответ

0 голосов
/ 12 июня 2018

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

function doMoveNode (node, parent) {

    // tell the server to move the node

    var nodeID = node.original.appData.id,
        parentID = parent.original.appData.id,
        success = false;

    // make a non-async call to move the node

    $.ajax({
        url: move-product.php',
        type: 'post',
        async: false,
        data: {
            nodeID: nodeID,
            parentID: parentID
        },
        dataType: 'json',
        success: function (json) {
            if (json.errorCode === 0) {
                // this happens when the server was happy
                success = true;
            }
        },
        error: function (xhr) {
            alert('an error occurred');
        }
    });

    return success;
}

function moveNode (node, parent, position, more) {
    // perform client-side validation to see if we can move node into parent
    // just a demo, so always return true
    return true;
}

$($tree).jstree({
    core: {
        data: $treeData,
        check_callback: function (op, node, parent, position, more) {
            switch (op) {
                case 'move_node':
                    if (more && more.core) {
                        // this is the condition when the user dropped
                        // make a synchronous call to the server and
                        // return false if the server rejects the action
                        return doMoveNode(node, parent);
                    }
                    // return true if we can move, false if not
                    return moveNode(node, parent, position, more);
            }
        }
    },
    plugins: ['dnd']
}).on('move_node.jstree', function(e, data) {
    // the move already happened
});
...