Scriptaculous sortable matrix

Question

I am trying to create a sortable image matrix, 5x5 using scriptaculous javascript library by I can't make it work.

I am trying using a table but I am having trouble linking the <td> into the Sortable object.

Do you guys have any hint or documentation I can go through to create this ?

Thanks

I have book for Scriptaculous and prototype, if you are interested in, please contact me on PM. — vaske, Oct 01 '08 at 20:24

Diodeus - James MacFarlane · Accepted Answer · 2008-10-01T23:59:54.470

2

Use floating DIVs, not tables.

1) Create a class in your stylesheet for your boxes.

.boxes {
  float:left;
  width:150px;
  height:150px;
  border:1px solid #cccccc
}

2) Make a container for your boxes. and put the boxes inside.

<div id='container' style='width:750px;height:750px;'>
<div id='box1' class='boxes'></div>
...etc
</div>

3) Make your Sortable

Sortable.create('container',{tag:'div'})

There is a demo of this type of thing available here.

Drop me a line if you need more help.

edited Oct 01 '08 at 23:59

answered Oct 01 '08 at 20:29

1 Answers1