[Seaside] How to Save a sorted list in Scriptaculous
Rajeev Lochan
lochan94 at gmail.com
Tue Aug 28 22:17:06 UTC 2007
Thanks for updating, I tried the following stuff and it worked. :)
html unorderedList id: 'sortItems';
script: (html sortable
onUpdate: (html request
triggerSortable: 'sortItems'
callback: [:col | self model items: col]));
with: [
self model items
do: [ :each |
html listItem
passenger: each;
with: each title]].
html submitButton callback: [self answer: self model}
As a matter of fact, I also tried the following things (Just in case anyone
like me wants more out of sorting list), you can also edit using textInput
...
html orderedList id: 'sortItems';
script: (html sortable
onUpdate: (html request
triggerSortable: 'sortItems'
callback: [:col | self model items: col]));
with: [
self model items
do: [ :each |
html listItem
passenger: each;
with: [self renderItemEditOn: each on: html]]].
html submitButton....
ListView >> renderItenEditOn: each on: html
renderItemFalse: anItem on: html
html textInput value: anItem title;
callback: [:value | anItem title: value]
Thanks a lot Lukas for the wonderful work of porting scriptaculous to
Seaside and helping the whole seaside community.
Regards,
Rajeev
On 8/29/07, Lukas Renggli <renggli at gmail.com> wrote:
>
> I just added to the Scriptaculous package a new example SUSortableTest
> (the old one is renamed to SUSortableDoubleTest).
>
> Name: Scriptaculous-lr.216
> Author: lr
> Time: 28 August 2007, 11:55:19 pm
> UUID: 74f452a8-083b-4155-bf82-aa83ff8ace0d
> Ancestors: Scriptaculous-lr.215
>
> - added a trivial example of sortable lists
>
> The code is as simple as:
>
> initialize
> super initialize.
> collection := #( 'San Salvatore' 'Monte Bre' 'Calvagione' )
>
> renderContentOn: html
> | id |
> html unorderedList
> id: (id := html nextId);
> script: (html sortable
> onUpdate: (html request
> triggerSortable: id
> callback: [ :value | collection := value
> ]));
> with: [ self renderListItemsOn: html ]
>
> renderListItemsOn: html
> collection do: [ :each |
> html listItem
> passenger: each;
> with: each ]
>
> On 8/28/07, Rajeev Lochan <lochan94 at gmail.com> wrote:
> > Hi,
> >
> > I had tried to imitate what you(Lukas) had posted on
> >
> > http://www.lukas-renggli.ch/smalltalk/seaside/web20.txt
> >
> > I also changed the renderItemOn: code after crosschecking from your site
> to
> >
> > html div
> > passenger: anItem;
> > with: [
> > html render: anItem title]
> >
> >
> > Still I am not able to figure out the solution.
> >
> > Regards,
> >
> > Rajeev
> >
> >
> > On 8/29/07, Rajeev Lochan <lochan94 at gmail.com> wrote:
> > > Hi Lukas,
> > >
> > > As suggested by you, I made the following changes.
> > >
> > > 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]));
> > > with: [
> > > self model items do: [:eachItem| self
> > renderItemOn:eachItem].
> > > html submitButton callback: [self answer: self model]; text:'Update'
> > >
> > >
> > > ListView>> renderItemOn: html
> > >
> > > html div id: 'myListEditItems';
> > > passenger: anItem;
> > > with: [
> > > html render: anItem title]
> > >
> > > When I try to update it, its not being done. The self halt introduced
> > earlier in
> > >
> > > onUpdate: (html request
> > > triggerSortable: 'items'
> > > callback: [:col |self halt. self model items:
> col]));
> > >
> > > is also not stopped for debugging.
> > >
> > > I Followed through the SUSortableTest to catch up a few hints. But
> that
> > seemed to be very complex compared to the situation we have here.
> > >
> > > I also tried html div class: 'myListEditItems'; But no progress
> either.
> > >
> > > Where i am i falling down ??
> > >
> > > Rajeev
> > >
> > >
> > >
> > >
> > >
> > >
> > >
> > >
> > >
> > > On 8/29/07, Rajeev Lochan <lochan94 at gmail.com> wrote:
> > > > Thanks Lukas,
> > > > I shall incorporate changes and come back
> > > >
> > > >
> > > >
> > > >
> > > >
> > > > On 8/29/07, Lukas Renggli < renggli at gmail.com > wrote:
> > > > > 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
> > > > > _______________________________________________
> > > > > Seaside mailing list
> > > > > Seaside at lists.squeakfoundation.org
> > > > >
> > http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
> >
> > > > >
> > > >
> > > >
> > > >
> > > >
> > > > --
> > > > Rajeev Lochan
> > > >
> > > > Co-founder, AR-CAD.com
> > > >
> > > > http://www.ar-cad.com
> > > > +91 9243468076 (Bangalore)
> > > > 080 65355873
> > >
> > >
> > >
> > > --
> > > Rajeev Lochan
> > >
> > > Co-founder, AR-CAD.com
> > >
> > > http://www.ar-cad.com
> > > +91 9243468076 (Bangalore)
> > > 080 65355873
> >
> >
> >
> > --
> > Rajeev Lochan
> >
> > Co-founder, AR-CAD.com
> >
> > http://www.ar-cad.com
> > +91 9243468076 (Bangalore)
> > 080 65355873
> > _______________________________________________
> > Seaside mailing list
> > Seaside at lists.squeakfoundation.org
> > http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
> >
> >
>
>
> --
> Lukas Renggli
> http://www.lukas-renggli.ch
> _______________________________________________
> Seaside mailing list
> Seaside at lists.squeakfoundation.org
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>
--
Rajeev Lochan
Co-founder, AR-CAD.com
http://www.ar-cad.com
+91 9243468076 (Bangalore)
080 65355873
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.squeakfoundation.org/pipermail/seaside/attachments/20070829/ad4742b5/attachment-0001.htm
More information about the seaside
mailing list