jQuery.fn.glowOrderedList
This plugin presents a sortable list which supports ordering, adding, and removing items
Usage
Initiate an orderable list of items
$('selector').glowOrderedList(options)
where selector contains select
element(s) and options
is an optional object argument
Options
-
width
: width of the ordered list- default:
200
- default:
-
height
: height of the ordered list- default:
300
- default:
-
itemsHtml
: array of html element strings to render as items in the ordered list- default:
[]
- default:
-
draggableOrderedLists
:- default:
null
- default:
Events
glowOrderedListItemSelected
: triggered when an item is selectedglowOrderedListItemRemoved
: triggered when an item is removedglowOrderedListItemMoved
: triggered when an item is movedglowOrderedListItemAdded
: triggered when an item is addeds
Methods
getIndexByPosition
Returns the index of item by an absolute x, y pixel position
var x = 100, y = 200;
$('selector').glowOrderedList('getIndexByPosition', x, y)
highlight
Boolean value which sets whether the items are highlighted
$('selector').glowOrderedList('getIndexByPosition', true)
addDraggedItem
Adds a dragged item at a given index
var index = 2;
var item = $('selector').glowOrderedList('createItem', {value: 'value', text: 'text', html: 'html', orderable: true, selectable: true});
$('selector').glowOrderedList('addDraggedItem', item, index, event);
selectedIndex
Returns the current selected index
var index = $('selector').glowOrderedList('selectedIndex');
moveTop
Moves the currently selected item to the beginning of the list
$('selector').glowOrderedList('moveTop');
moveUp
Moves the currently selected item up by one position
$('selector').glowOrderedList('moveUp');
moveDown
Moves the currently selected item down by one position
$('selector').glowOrderedList('moveDown');
moveBottom
Moves the currently selected item to the end of the list
$('selector').glowOrderedList('moveBottom');
resize
Resizes the ordered list to a given pixel width and height
var x = 400;
var y = 300;
$('selector').glowOrderedList('resize', x, y);
disabled
Gets and/or sets whether the ordered list is disabled
var isDisabled = $('selector').glowOrderedList('disabled');
$('selector').glowOrderedList('disabled', true);
select
Selects an item by index
var index = 4;
$('selector').glowOrderedList('select', index);
add
Add a new ordered list item
var item = $('selector').glowOrderedList('createItem', {value: 'value', text: 'text', html: 'html', orderable: true, selectable: true});
$('selector').glowOrderedList('add', item);
remove
Removes an ordered list item
$('selector').glowOrderedList('remove', item);
clear
Removes all items
$('selector').glowOrderedList('clear');
insert
Add a new ordered list item at a specific index
var item = $('selector').glowOrderedList('createItem', {value: 'value', text: 'text', html: 'html', orderable: true, selectable: true});
$('selector').glowOrderedList('insert', item, 4);
getByIndex
Returns an item at a specific index
var item = $('selector').glowOrderedList('getByIndex', 4);
count
Returns the count of items
var count = $('selector').glowOrderedList('count');
createItem
Creates a new ordered list item suitable for adding/inserting
var item = $('selector').glowOrderedList('createItem', {value: 'value', text: 'text', html: 'html', orderable: true, selectable: true});