[Seaside-dev] Re: Seaside jQuery - Sorting a list with drag and drop and sending it back via Ajax causes OrderedCollection to turn into an Array?

Paul DeBruicker pdebruic at gmail.com
Wed Feb 25 23:29:10 UTC 2015


basilmir wrote
> The code below is form the Seaside book at:
> http://book.seaside.st/book/web-20/jquery/enhanced-todo-application/drag-and-drop
> 
> 
> 
> ToDoListView>>renderContentOn: html
> 
> self renderHeadingOn: html.
>      html form: [(html unorderedList)
>                                     id: (listId := html nextId);
>                                     script: ((html jQuery new sortable)
>                                                             onStop: (html
> jQuery ajax
>                                                             callback:
> [:items | self model items: items]
>                                                             passengers:
> (html jQuery this find: 'li'));
>                                                             axis: 'y');
>                                    with: [self renderItemsOn: html].
>                        
>                        (html submitButton)
>                                 callback: [self add];
>                                 text: 'Add'].
> html render: editor
> 
> My instance variable _itemList is initially OrderedCollection. As soon as
> I move the rows around in the page then entire list is sent back in it's
> new order. However, this time setItemList: receives an Array.
> 
> Does this make any sense? Am I missing something?

So the Seaside callback processing code doesn't know that a javascript array
should be converted into an OrderedCollection for your use?  

If it were me I'd just add and #asOrderedCollection in your callback block 

e.g. 

ToDoListView>>renderContentOn: html

self renderHeadingOn: html.
     html form: [(html unorderedList)
                                    id: (listId := html nextId);
                                    script: ((html jQuery new sortable)
                                                            onStop: (html
jQuery ajax
                                                            callback:
[:items | self model items: items asOrderedCollection]
                                                            passengers:
(html jQuery this find: 'li'));
                                                            axis: 'y');
                                   with: [self renderItemsOn: html].
                       
                       (html submitButton)
                                callback: [self add];
                                text: 'Add'].
html render: editor



and handle it

or better yet


ToDoListView>>renderContentOn: html

self renderHeadingOn: html.
     html form: [(html unorderedList)
                                    id: (listId := html nextId);
                                    script: ((html jQuery new sortable)
                                                            onStop: (html
jQuery ajax
                                                            callback:
[:items | self setModelItemsFrom: items]
                                                            passengers:
(html jQuery this find: 'li'));
                                                            axis: 'y');
                                   with: [self renderItemsOn: html].
                       
                       (html submitButton)
                                callback: [self add];
                                text: 'Add'].
html render: editor

then define #setModelItems: to do just what I needed.  By defining a method
in your callback block to set the inst vars value you get to edit the action
of the callback without refreshing/redrawing the component.  









--
View this message in context: http://forum.world.st/Seaside-jQuery-Sorting-a-list-with-drag-and-drop-and-sending-it-back-via-Ajax-causes-OrderedCollecti-tp4805445p4807734.html
Sent from the Seaside Development mailing list archive at Nabble.com.


More information about the seaside-dev mailing list