jQuery UI - droppable avec code supplémentaire

Dans cet exemple, on utilisera l'argument ui qui peut être passé dans une fonction à l'intérieur d'un élément de jQuery UI. De cette manière, nous avons accès facilement aux objets de l'interface qui utilisent des éléments de jQuery UI.

Drag me!

Le carré bleu, au contraire, sera accepté s'il sera trainé complètement à l'intérieur de l'élément cible.

Drag me!
Drop inside this area!

Voici le code utilisé pour cet exemple :

$("#redBox").draggable();
$("#bluBox").draggable();
$("#blackBox").droppable({
	tolerance: 'fit',
	drop: function(event, ui) {
		if(ui.draggable.attr("id") == "redBox") {
			ui.draggable.draggable("option", "revert", true); //renvoyer l'élément à l'origine
			ui.draggable.text("No way!");
		} else {
			ui.draggable.text("Yes sir!");	
		}
	}
});

MAF (29.11.2018)