jQuery Draggable + Sortable - Comment rejeter une goutte dans le tri?

J'ai une liste triable de vidéos et un déplaçable ensemble de vidéos. Fondamentalement, je veux faire en sorte que les vidéos traîné dans sont pas dans les 5 premières minutes de la vidéo. Comme la vidéo longueurs varient que je veux tester cela sur le menu ajouter le temps jusqu'à l'époque et si pas 5 min de revenir et de montrer une erreur.

J'ai essayé d'accrochage dans tous les rappels déplaçable et sortable (y compris les sans-papiers revenir rappel) pour faire mon test, mais ce que j'essaie, le dom obtient toujours changé (et triable appelle sa mise à jour de rappel)...

Quelqu'un aurait-il des suggestions?

source d'informationauteur lopsided

  1. 10

    Vous pouvez annuler l'opération de glisser par l'appel de la cancel méthode de la déplaçable widget (cette méthode est sans-papiers, mais son nom ne commence pas par un caractère de soulignement, ce qui rend sans doute "plus sûr" à utiliser de manière fiable). Il ne fonctionne que pendant la start événement, même si, comme d'autres événements se produisent trop tard pour déclencher le revert de l'animation.

    Cependant, la sortable widget va encore enregistrer une perte, même si l'opération de glisser est annulée, de sorte que vous devez également supprimer le nouvellement ajouté élément (au cours de la stop événement, comme dans l' start événement se produit trop tôt):

    $("#yourSortable").sortable({
    start: function(event, ui) {
        if (!canDropThatVideo(ui.item)) {
            ui.sender.draggable("cancel");
        }
    },
    stop: function(event, ui) {
        if (!canDropThatVideo(ui.item)) {
            ui.item.remove();
            //Show an error...
        }
    }
});

    Vous pouvez voir les résultats dans ce violon (le quatrième point sera toujours revenir).

    Mise à jour: Comme John Kurlak à juste titre remarquer dans les commentaires, l'article n'est pas de revenir en raison de l'appel à draggable("cancel")mais parce que ui.sender est null dans notre cas. En lançant tout ce résultats dans le même comportement.

    Hélas, toutes les autres combinaisons, j'ai essayé suite à l'article d'être annulées sans l'animation, peut-être notre meilleur pari est de ne pas accéder ui.sender et au lieu d'écrire quelque chose comme:

    start: function(event, ui) {
    if (!canDropThatVideo(ui.item)) {
        throw "cancel";
    }
}

    L'exception non interceptée apparaissent toujours dans la console, si.

  2. 3

    J'ai trouvé une manière différente. Si vous n'avez pas l'esprit de ne pas avoir l'animation de celui-ci flottant retour à son lieu d'origine, vous pouvez toujours utiliser ce

    .droppable({
    drop: function (event, ui) {

        var canDrop = false;

        //if you need more calculations for
        //validation, like me, put them here

        if (/*your validation here*/)
            canDrop = true;

        if (!canDrop) {
            ui.draggable.remove();
        }
        else{
            //you can put whatever else you need here
            //in case you needed the drop anyway
        }
    }
}).sortable({
    //your choice of sortable options
});

    j'ai utilisé ce parce que j'avais besoin de la chute de l'événement.