CODEWITHSUNDEEP
jquery-ui
santa
santa

Reputation: 12512

jQuery UI droppable problem

I have a script that uses jQuery UI's graggable and droppable functionality.

Items are dragged from left panel into main area and dropped.

There are two scenarios:

  1. Items are dropped into other boxes, preset on page load or can be dropped into main area to create a new box. The items can be moved between the boxes. Everything works fine with this setup.

  2. In second scenario there are no preset boxes in main area. They are supposed to be created whn an item is dragged and dropped from the left panel. However, for some reason it only allows me to create one box. Here's an example.

My level of UI proficiency is not high enough to spot what the problem is.

Upvotes: 1

Views: 382

Answers (1)

Andrew Whitaker
Andrew Whitaker

Reputation: 126072

Your problem is that in this code:

$.when(createEmptyStack()).then(function(data) { ... }

data is always "" meaning that you're attempting to add a new element to the page with the same id over and over again (your AJAX request to createEmptyStack is not returning anything in the response). This is why it works fine the first time; the id doesn't exist and so the code works as expected.

When you drag another item into the main area, the element may be successfully appended, but it has a duplicate id. This code:

putCardIntoStack(ui.draggable,newstackId);

(in the same block as the code above)

Is always called with the draggable object and just STACK as the newstackId.

In short, this is a problem with your server-side code not returning a stack id. According to Firebug, your AJAX request isn't returning anything at all.

Upvotes: 1

Related Questions