madrobby / scriptaculous

Description:

script.aculo.us is an open-source JavaScript framework for visual effects and interface behaviours.

Home

Sortable

Behaviours > Sortable

A Sortable is a quick way to initialize many Draggable elements in a container element. When you create a new Sortable, it takes care of the creation of the corresponding draggable Droppables.

Syntax

Use Sortable.create('id_of_container',[options]); to create new Sortables. See Sortable.create.

Object

_Property/Method	Description
SERIALIZE_RULE	`(RegExp) /^[^_\-](?:[A-Za-z0-9\-\_])[_](.)$/`
sortables	(Object) { }
options (element)	Internal function
destroy (element)	Destroys sortable
create (element, options)	Creates sortable
findElements (element, options)	Internal function
onHover (element, dropon, overlap)	Internal function, which may be overridden through the options parameter on creation
onEmptyHover (element, dropon, overlap)	Internal function
unmark()	Internal function
mark()	Internal function
tree (element)
sequence (element)
setSequence (element, new_sequence)
serialize (element)

Demos

See Sortable Lists Demo, Ghostly Sortable Demo? and Sortable Floats Demo?.

Creating sortables

See Sortable.create.

Disabling sortables


  Sortable.destroy( element );

A call to Sortable.create implicitly calls Sortable.destroy if the referenced element was already a Sortable.

Functions

Function	Description
Sortable.serialize	The Sortable object also provides a function to serialize the Sortable in a format suitable for HTTP GET or POST requests. This can be used to submit the order of the Sortable via an Ajax call. See Sortable.serialize
Sortable.sequence	The Sortable object also provides a function to get the values in an sequence array object. See Sortable.sequence

Tutorials

Use PHP and Ajax call to interact with Sortable

A short tutorial on using Sortables prepared for the Linux Users Group, Villafranca, Italy.

Last edited by paulshen, 4 months ago