Sort Before Drop

Question

I want to sort my items before I drop it.

this is my code

$(function () {
    $('.box').draggable({
        revert: true
    });
    $('.dest').droppable({
        accept: '.left .box',
        drop: function (event, ui) {
            $newElt = $('<div class="box"></div>');
            $newElt.appendTo(this);
        }
    });
    $(".dest").sortable();
});

this is a JSFiddle.

this is like what I want to do (Example)

Which items do you want to sort before you drop? By what criteria? — Asad Saeeduddin, Dec 02 '13 at 04:30
how can you sort before drop? Is set to revert if not dropped — charlietfl, Dec 02 '13 at 04:42
@Raika Sort position according to what criteria? All you have is a blank box. — Asad Saeeduddin, Dec 02 '13 at 04:44
but @Raika what you are asking makes no sense and demo doesn't have anything to sort — charlietfl, Dec 02 '13 at 04:47
perhaps you mean to say you want to insert new element in sorted order, instead of appending it? — charlietfl, Dec 02 '13 at 04:50
then create a demo that can be used to set up with. First one is worthless — charlietfl, Dec 02 '13 at 05:53
you need to create demos that are representative of what you need. And provide proper explanations up front of what you expect. The lack of effort you put into your demo is why you never really got any help — charlietfl, Dec 02 '13 at 13:11
@charlietfl this is what I wanted : http://jsfiddle.net/3bmMe/ — , Dec 02 '13 at 18:41
I thought his question made sense enough to answer. At the very least I replied with very similar question. Which only means that Raika didn't search too hard (or for the correct phrasing). — DevlshOne, Dec 03 '13 at 12:27

score 1 · Answer 1 · edited Jan 27 '14 at 01:27

1

jsFiddle Demo

$(function () {
    $('.box').draggable({
        revert: true
    });
    $('.dest').droppable({
        accept: '.left .box',
        drop: function (event, ui) {
            $('.dest').sortable('refresh');
            $newElt = $('<div class="box"></div>');
            $newElt.appendTo(this);
        }
    });
    $(".dest").sortable({
        revert:50,
        forcePlaceholderSize: true
    });
});

edited Jan 27 '14 at 01:27

animuson

53,861
28
137
147

answered Dec 02 '13 at 04:45

DevlshOne

8,357
1
29
37

If this doesn't help, check [this](http://stackoverflow.com/questions/19732011/jquery-ui-droppable-and-sortable-dropping-in-the-correct-sort-location?rq=1) post. – DevlshOne Dec 02 '13 at 04:47
that link help a lots and work but I want one thing more. that show drop position by some border or something – Dec 02 '13 at 12:17
That would be the `placeholder` method. – DevlshOne Dec 03 '13 at 00:55
is there any example? – Dec 03 '13 at 03:15

Sort Before Drop

1 Answers1