Drag and drop

En este ejemplo se muestra la funcionalidad de arrastrar y soltar (drag and drop) en JavaScript.

Se parte de un listado de películas, que se muestran en el panel de Películas disponibles. Cada vez que se hace clic en una película pasa directamente al panel de Películas seleccionadas, y se ubica en la última posición.

Al panel de Películas seleccionadas se le han añadido una serie de funciones que permiten hacer drag and drop con sus filas. Puedes hacer clic en una fila y, sin soltar el ratón, la puedes mover a otra posición. Una vez que sueltes el ratón, la fila se reubicará en la posición que hayas decidido. Fíjate que, al mismo tiempo, se reorganiza también el panel de Para guardar en base de datos.