Martin Scheffler wrote:
>
> I am not sure if this is what you want:
> You have two sortables, and you want to be able to move draggables from
> one sortable to the other. To do this, give both sortables these options
> on startup: {containment:["boxlist1", "boxlist2"]}
Hi Martin,
Thanks for replying and throwing some light on this issue. You got it
right, i want two sortables (eventually there will be 'n' sortables
which i should be able to place on the page dynamically) and I should be
able to drag items within this sortables into another sortables.
Below is the snippet of code, which is mostly taken from examples of
scriptaculous and added little stuff to do nested sortables (or drap and
drop).
/**
<html>
<head>
<title>Nested Sortables</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script src="../../lib/prototype.js" type="text/javascript"></script>
<script src="../../src/scriptaculous.js"
type="text/javascript"></script>
<script src="../../src/unittest.js" type="text/javascript"></script>
<link rel="stylesheet" href="../test.css" type="text/css" />
<style type="text/css" media="screen">
ul { height: 100px; border:1px dotted #888; }
</style>
</head>
<body>
<h1>Nested Sortables</h1>
<ul id="firstlist">
<li id="thelist1_1">Hey there! I'm item#1/1</li>
<li id="thelist1_2">Hey there! I'm item#1/2</li>
<li id="thelist1_3">Hey there! I'm item#1/3</li>
</ul>
<ul id="secondlist">
<li id="thelist2_1">Hey there! I'm item#2/1</li>
<li id="thelist2_2">Hey there! I'm item#2/2</li>
<li id="thelist2_3">Hey there! I'm item#2/3</li>
</ul>
<script type="text/javascript" language="javascript" charset="utf-8">
// <![CDATA[
Sortable.create("firstlist",
{dropOnEmpty:true,containment:["firstlist","secondlist"],constraint:false});
Sortable.create("secondlist",
{dropOnEmpty:true,containment:["firstlist","secondlist"],constraint:false})
// ]]>
</script>
<!-- Trying to sort firstlist and second list but not successful. Tried
to make one more list element mainlist comprising of firstlist,
secondlist but it didn't work for me and then made firstlist and second
list as draggable so now dragging is workign fine but not soring. How
should i do this?-->
<script type="text/javascript" language="javascript">
new Draggable('firstlist',{revert:true});
new Draggable('secondlist',{revert:true});
</script>
<a href="#" onclick="alert(Sortable.serialize('firstlist'));return
false;">Serialize sortable1</a>
<a href="#" onclick="alert(Sortable.serialize('secondlist'));return
false;">Serialize sortable2</a>
<div id="debug"></div>
</body>
</html>
*/
I am trying out options in it. If I arrive to the solution, i will
inform you. But if you know where i m messing up, please inform me.
Thanks!
Regards,
--
Posted via http://www.ruby-forum.com/.
_______________________________________________
Rails-spinoffs mailing list
Rails-spinoffs@lists.rubyonrails.org
http://lists.rubyonrails.org/mailman/listinfo/rails-spinoffs
