2

I need to be able to drag a tree node to a div. I'm having problems getting the mouseicon to render correctly. It always displays as a X (jstree-er), even when the class in the DOM is changed to jstree-ok.

I have debugged and am certain that the DOM is being changed. It just isn't being rendered any differently.

Nb. the solution found here doesn't work, hence commented out that approach (the data.helper.find returns nothing).

$(document).on('dnd_move.vakata', function (e, data) {
        var t = $(data.event.target);

        // Valid drop target?
        if (t[0].classList.contains("dropzone")) {
            $("#jstree-dnd i").removeClass('jstree-er').addClass('jstree-ok');
            //data.helper.find('.jstree-icon').removeClass('jstree-er').addClass('jstree-ok');
            console.log($("#jstree-dnd i"));
        }
        else {

            $("#jstree-dnd i").removeClass('jstree-ok').addClass('jstree-er');
            //data.helper.find('.jstree-icon').removeClass('jstree-ok').addClass('jstree-er');
            console.log($("#jstree-dnd i"));
        }

    })

Update: jsfiddle added. However, it works okay in a jsfiddle. Turns out that coincidentally trying an older JQuery here highlighted the issue... JSFiddle

Janine Rawnsley
  • 1,240
  • 2
  • 10
  • 20
  • 2
    can you create a jsfiddle and post it here or you can update your post and add code snippet – LogicalAnt Feb 27 '19 at 10:58
  • The UI won't change if an element with `jstree-er` has a higher precedence in your/jstree-dnd css rules. Without a working sample, it's impossible to tell if there's *another* element that has `jstree-er`. – freedomn-m Feb 27 '19 at 11:06
  • JSFiddle added, unfortunately though - it works in the fiddle. More stumped than before! – Janine Rawnsley Feb 27 '19 at 11:27

1 Answers1

0

Seems the issue is some incompatibility between JQuery 3.3.1 and JSTree 3.3.7

The above code works fine using JQuery 2.2.4

Janine Rawnsley
  • 1,240
  • 2
  • 10
  • 20