[Seaside] How to Save a sorted list in Scriptaculous

[Lukas Renggli]

There are many different problems with your approach:

> ListView>> renderContentOn: html
> html form: [
> html render: self model title.
> html div class: 'items';
>                  script: (html sortable tag: 'div';
>                     onUpdate: (html request
>                     triggerSortable: 'items'
>                     callback: [:col | self model items: col]));

If you say the sortable should use 'div' tags, then all elements
inside your container should be of that kind. Check out the method
comment of #tag:

>                 with: [
>                     self model items do: [:eachItem| self
> renderItemOn:eachItem].
>                      html submitButton callback: [self answer: self model]]]

Uhh, the button should be outside the container.

> ListView>> renderItemOn: anItem
> html
>         table: [html
>                 tableRow: [html tableData id: 'checkBoxItem';
>
>                         with: [html checkbox value: anItem done;
>
>                                 callback: [:value | anItem done: value]].
>                     html tableData id: 'myListEditItems';
>                         passenger: anItem;
>                         with: [
>                             html render: anItem title]]]

The sortable elements should be DIV-tags, if you declare them to be
DIVs. Tables in general don't work together with drag&drop, so avoid
them altogether (see documentation of script.aculo.us).

Furthermore you need to assign the #passenger: to the direct child of
the container (the DIV). Again see the documentation of
script.aculo.us.

> The page is rendered and the items can be sorted. The sorting is only done
> on the client end. If I submit the button, the new order of the items isn't
> updated. Am I missing anything ?

That's because you tell Scriptaculous to only consider div-tags, but
you add table-tags as children.

Have a look at SUSortableTest for a working example.

HTH,
Lukas

-- 
Lukas Renggli
http://www.lukas-renggli.ch