i did some searching through the archives and didn''t really find an
answer to my question, so i''m going to just ask it.
i have a situation where there are 3 sortable lists. list1, list2,
and list3 i need list2 to accept divs from all 3 lists, but list1 and
list3 to only accept divs from the list1 and list3 i''ve added two
classes to the divs in my sortables: .rail for list1 and list3, and
.center for list2. i then added the appropriate accept options to my
sortables code. seems to make no difference at all. any help would
be appreciated as i really need this sort of feature to work. here''s
the code i''m working with:
<html>
<head>
<title>test page</title>
<script src="assets/scriptaculous-js-1.6.1/src/prototype.js"
type="text/javascript"></script>
<script src="assets/scriptaculous-js-1.6.1/src/scriptaculous.js"
type="text/javascript"></script>
<style>
#container {width: 550px;margin: 30px auto 0px auto;padding: 0px;}
#list1, #list2, #list3 {padding-bottom: 10px; border:1px solid #000;}
#list1 div, #list2 div, #list3 div {color: #FFF;border:1px solid
#666;background-color: #7F7D7D;padding: 2px 5px;width:
150px;text-align: center;margin: 2px;font-size:
10px;font-family:verdana;cursor:move;}
</style>
</head>
<body>
<div id="container">
<div id="list1" style="float:left;">
<div class="rail" id="left1">left 1</div>
<div class="rail" id="left2">left 2</div>
<div class="rail" id="left3">left 3</div>
<div class="rail" id="left4">left 4</div>
<div class="rail" id="left5">left 5</div>
</div>
<div id="list2" style="float:left;">
<div class="center" id="center1">center
1</div>
<div class="center" id="center2">center
2</div>
<div class="center" id="center3">center
3</div>
<div class="center" id="center4">center
4</div>
<div class="center" id="center5">center
5</div>
</div>
<div id="list3" style="float:left;">
<div class="rail" id="right1">right 1</div>
<div class="rail" id="right2">right 2</div>
<div class="rail" id="right3">right 3</div>
<div class="rail" id="right4">right 4</div>
<div class="rail" id="right5">right 5</div>
</div>
</div>
<script>
Sortable.create("list1",
{tag:''div'',dropOnEmpty:true,constraint:false,containment:["list1","list2","list3"],accept:["rail"]});
Sortable.create("list2",
{tag:''div'',dropOnEmpty:true,constraint:false,containment:["list1","list2","list3"]});
Sortable.create("list3",
{tag:''div'',dropOnEmpty:true,constraint:false,containment:["list1","list2","list3"],accept:["rail"]});
</script>
</body>
</html>
