jQuery: MoveAndRemove Plugin

Examples

Vertical sorting (unordered list)

Order these fruits so your favourite one comes first.

• Apples

  

• Bananas

  

• Oranges

  

• Strawberries

  

        /*Vertical sorting (default setting)*/
        $('ul#sortVertical').moveAndRemove();

Horizontal sorting + deleting

Move the fruits left or right.
If you don't like one you can also delete it.

• Apples

  

• Bananas

  

• Oranges

  

• Strawberries

  

        /*Horizontal sorting + deleting*/
        $('ul#sortHorizontal').moveAndRemove({
            mode: 'horizontal',
            showDelete: true,
            canDeleteLast: true
        });
    

Documentation

Options

elArrowUp
elArrowDown
elArrowLeft
elArrowRight
elDelete

• HTML elements that gets inserted for the various arrows and the optional delete button..
• type:string (html element)
• default:For elArrowUp for example it is 'Move up'. For the other elements it's a similar chuck of HTML.

showDelete

• Determines whether "delete" icon should be shown.
• type:boolean
• default:false

mode

• Triggers horizonal or vertical arrow-styles.
• type:string
• default:vertical
• options:'vertical', 'horizontal'

swapClasses

• Swaps the classes of the items who change positions. Useful e.g. to preserve the zebra-stripyness of an item collection.
• type:boolean
• default:true

canDeleteLast

• If showDelete = true this option makes it possible to delete all items, even the last one.
• type:boolean
• default:false

setZebraStripes

• Automatically adds the classes odd/even to an item collection so it can be styled in cute zebra stripes
• type:boolean
• default:false

Events

afterMove

• Gets triggered after an item is moved
• type:function
• default:empty function that does nothing

afterDelete

• Gets triggered after an item is deleted
• type:function
• default:empty function that does nothing

Download

Grab the latest version of the jQuery MoveAndRemove plugin on GitHub.

Todo's

• Refactoring code as it is a bit clumsy
• Finish moving table rows/columns feature
• Adding more hooks to customize it