Je ne comprends pas bien drag drop scriptaculous

Version imprimable

Voici mon code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<script type="text/javascript" src="lib/prototype.js"></script>
<script type="text/javascript" src="src/scriptaculous.js?load=effects,dragdrop"></script>
 
<style type="text/css">
 
div#source {
width: 100px;
height: 100px;
cursor: move;
background: #9fcfba;
}
 
</style>
 
</head>
<body>
<div id="source" >
Draggable
</div>
<div id="source2" style="height: 100px; width: 100px; background-color: gray;">
Draggable2
</div>
<script type="text/javascript">
new Draggable("source", {
revert:"failure"
});
 
new Draggable("source2", {
revert:"true"
});
</script>
 
<br/>
 
<div id="target" style="height: 100px; width: 100px; background-color: green;">
Good Target 1
</div>
 
<div id="target2" style="height: 100px; width: 100px; background-color: green;">
Good Target 2
</div>
 
<script type="text/javascript">
 
Droppables.add('target', {
accept: 'source',
// containment:'source',
onDrop:function(element){ Test() }
});
 
Droppables.add('target2', {
containment: 'source2',
onDrop:function(element){ Test() }
});
 
function Test(){
alert('OK');
}
 
</script>
 
<br/>
 
</body>
</html>

accept devrait me permettre d'accepter dans le droppable les div de classe "source"; containment devrait me permettre d'accepter dans le droppable le div dont l'ID est "source2".
Mais cela ne passe pas.
Quand j'enlève ces options cela passe.
Si quelqu'un veut bien prendre le temps de m'expliquer le pb cela me rendrait bien service.

11/05/2009, 15h59
RomainVALERI

D'abord bienvenue à toi nono ^^
A propos de la forme de ton message : jette quand même un oeil ici >>> règles du forum ;) (notamment : utilisation des balises CODE) >>> tu auras plus de lecteurs potentiels de ton problème... ^^
11/05/2009, 16h09
nono95

mon message était mal mis en forme

Désolé, c'était mon premier message ==> je ferai mieux à l'avenir, c'est promis.
11/05/2009, 16h20
RomainVALERI

Une idée : est-ce que tes div 'source' et 'source2' ne devraient pas avoir comme propriété class="source" pour que ton param

Code:

accept: 'source'

les considèrent comme des candidats acceptables ? :? (>>> page Droppables)
11/05/2009, 16h39
nono95
oui, effectivement cela fonctionne avec le paramètre accept.
Je pensais qu'il n'était pas nécessaire de faire référence à la class "source"
dans la balise DIV puisque le CSS était
Code:

1 2 3 4 5 6 div#source { width: 100px; height: 100px; cursor: move; background: #9fcfba; }
Cela passe donc pour la mise en forme, mais pas pour le paramètre accept de droppable.

Par contre le paramètre containment lui ne fonctionne pas dans mon code, or il attend bien un ID et pas une classe si j'ai bien lu la doc de scriptaculous.

Merci en tout cas pour ce début de réponse.