Drag and drop between two select's?

Hi all. this is my problem:
* I want to be able to drag and drop items boths sides of two <select> lists, and if possible, both to be sorted.
* I've seen examples using simple xhtml lists (#unorderedList), but not using xhtml <select> with <option>'s as items. AFAIK, the difference is using a list you're in control of the rendering of an item (see #renderInventoryOn: or #renderListItems: On: ) but using a select, how do I specify the #passenger: for each <option>?
* Don't know if makes any difference, but right now I'm filling the select's dinamically.

My guess:

#renderDivAOn: html
    html div id: 'divA';
        with: [ html select
                    size: 10;
                    list: self itemListA;
                    script: ( html sortable
                                  constraint: false;
                                  dropOnEmpty: true;
                                  containment: #(divA divB);
                                  onUpdate: ( html updater ?????) );
                    on: #itemListA
                    of: self ]

the same for #renderDivBOn: html, and if #itemListA was:

    ^ Collection methodDictionary keys

now it's gonna to be something like?:

#itemListAOn: html
    ^ Collection methodDictionary keys
              collect: [: each | html option;
                                              passenger: each;
                                              with: [ each ] ]

Any idea?
(I'm using Scriptaculous-lr.216)

Cheers


_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

> * I want to be able to drag and drop items boths sides of two <select>
> lists, and if possible, both to be sorted.

I don't think that can possibly work. Select lists are form elements
that some famous browsers even render as native widgets. Absolute
positioning of <option> elements as it is required by the JavaScript
drag-and-drop code will hardly ever work in a cross browser compatible
way.

I suggest that you use an #unorderedList for the drag-and-drop and
apply some decent CSS styles to make it look like a select-list. I
guess it should be fairly easy to make it match the look and
functionality of a select-list.

> * I've seen examples using simple xhtml lists (#unorderedList), but not
> using xhtml <select> with <option>'s as items. AFAIK, the difference is
> using a list you're in control of the rendering of an item (see
> #renderInventoryOn: or #renderListItems: On: ) but using a select, how do I
> specify the #passenger: for each <option>?

Exactly the same way you manually render an #unorderedList. Both tags
(<ul> and <select>) essentially support the same protocol with #list:,
#selected:, #callback:, etc. Elements that you specify using #list:
are added automatically, but you always have the possibility to do
your own thing. For details on how to make the callbacks work have a
look at WASelectTag>>#renderListItem:labelled:

Lukas

--
Lukas Renggli
http://www.lukas-renggli.ch
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside