jQuery UI Method - Part 2

My last article (jQuery UI Method Part 1) was about the sortable() method using $(selector, context).sortable (options).

Syntax

Now this article explains another form and some other methods. The second form of the sortable() method is:

$(selector, context).sortable ("action", [params])

In the sortable (action, params) method, we can perform an action on the sortable elements, such as to prevent displacement. The action is specified as a string in the first argument and optionally, one or more params can be provided based on the given action.

Basically, here the actions are nothing but jQuery methods that we can use in the form of a string.

Here in this method we can use various actions like: cancel(), destroy(), disable(), enable(), option(optionName), option(), option(optionName, value), option(option), toArray(), refresh(), widget() and so on.

Now let's see the use in an example. Here in this example we are using toArray that provides a sequence of elements.



The output for that code will be:



And when we sort using the cursor the Sequence number will be shown. See the result:



Try sorting the items in other ways, the sequence of items is displayed at the bottom. Here we are calling $(this).sortable('toArray').toString(), that will provide a string list of all the item id's, it might look like 1,2,3,4.

Similarly we can use other methods. Do practice.

jQueryUI provides event methods that are triggered for a specific event.

These event methods are listed below. Follow them and do more practice.



Do more practice, you will get more knowledge. Other methods will be discussed in the next article.