Lighthouse has a new layout. Prefer the old one? Return to the old layout, and switch back any time from the link at the top of each page.

Add sortable_element example

#2

My co-worker and myself have often been frustrated at the lack of descriptive examples when is comes to the script.aculo.us helper methods. Enclosed is a minor addition to the sortable_element documentation that includes an example with a few options not currently disclosed in the docs.

This patch was generated from repo v7118 (patched by the mega patch).

Important: For this to work, the sortable elements must have +id+

attributes in the form "string_identifier" (for example, "item_1"),

where the string portion does not contain underscores. Only the identifier

part of the +id+ attribute will be serialized.

Example 2:

  • move Item 1
  • move Item 2

<%=

  1. Generates: Sortable.create("my_list", {handle:'drag', onUpdate:function(){
  2. new Ajax.Updater('items', '/testing/order', {asynchronous:true, evalScripts:true, onComplete:function(request){
  3. new Effect.Highlight("my_list",{});}, parameters:Sortable.serialize("my_list")})}})

sortable_element "my_list", :complete => visual_effect(:highlight, "my_list"),

:handle => "drag", :update => "my_list", :url => { :action => "order" }

%>

In Example 2, +my_list+ is the list of items to be reordered,

+complete+ dictates what javascript should be run when the ajax request is complete,

+handle+ indicates the dragable area of an individual list item,

+update+ instructs the page to replace the innerHTML of the element "my_list" with the response from the ajax request.

Reported by Nathan · June 25th, 2007 @ 08:58 PM

State: new
Milestone: none
Assigned to: nobody

Activity

No comments yet.

Please Sign in or create a free account to add a new ticket.

With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.