Draggable elements in nested click jQuery

Question

Following @amphetamachine advice from this question I was able to handle nested clicks using jQuery. Now the drag feature that was previously working is now not working after implementing the delegates.

The concept still the same an empty DIV that once it will it will add another DIV inside itself and if that created DIV is click it is then remove. I use a variable to determine if I want to drag the DIV or to remove it.

HTML

<div id="container"></div>

jQuery

$('#container').on('click', function(e){

  // Add other DIV
  $( this ).append('<div class="other">XYZ</div>');

  e.stopPropagation();

  // Remove other DIV
  $('div.other').bind('click', function(event){

    if (global_variable == 'drag') {
      $( this ).draggable({cursor:'move'});
    }
    else {
      $( this ).remove();
    }

    event.stopPropagation();

  });

});

What am I missing?

Emil Orol · Accepted Answer · 2015-01-14 04:44:07Z

0

I was able to find the answer. Here is the code working: http://jsfiddle.net/9sbnq3pv/1/

I just needed to do:

    // Add other DIV
    var div = $('<div class="other">XYZ</div>');
        div.draggable({cursor:'move'});
    $(this).append(div);

Instead of:

  // Add other DIV
  $( this ).append('<div class="other">XYZ</div>');

Thank you

answered Jan 14, 2015 at 4:44

Emil Orol

5616 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Draggable elements in nested click jQuery

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related