[résolu] Mootools - Drag&Drop rend formulaire inaccessible

Bonsoir,

Grâce a vous j'ai découvert mootools et je dois dire que l'on peut faire beaucoup de chose excellente !
Cependant comme un bon noob j'ai un peu de mal ...
J'ai mis en œuvre le drag and drop sans trop de soucis (c'est très simple!!) mais a cause de ce drag and drop je ne peux plus avoir accès a mes formulaires ...

Vous pouvez tester cela sur mon site : Mon site
Pour ce faire cliquer sur le bouton connexion ou enregistrement.

Un peu d'indulgence pour mon site, c'est pas très sérieux et le code est pas très bien arrangé encore ...
Merci, KalNex

PS: si vous avez d'autre suggestion : elles sont les bienvenue
Modifié par KalNex (11 Feb 2008 - 13:08)

Salut,

le fait que tu n'accede pas aux éléments du formulaire est tout a fait normal puisque le fait de rendre draggable la div .boxin attrape l'evenement mousedown sur toute la div (et comme tes inputs sont dans ta div, il en est de meme pour eux).

En gros pour résoudre ton problème le mieux serait de te servir de l'option handler de la classe Drag de mootools. Ainsi tu défini ta div comme draggable mais la zone de ta div avec laquelle tu pourras dragger ta div sera cet élément spécifié dans l'option handler. Je pense qu'il doit y avoir de la doc et/ou un exemple sur le site de mootools.

Suis-je clair?

Merci de l'info !

Je viens de faire les modifications (en local, je peux pas sur mon serv avant ce soir) et ça marche pas mal.
J'ai du changer le code ce qui donne ça :

// Rend les fenêtres de connections et d'enregistrement draggable 
// (limité au contenu de la page par le voile et uniquement sur le titre de la boite)
var dragClass = $$('div.boxin'); // sélection de la div pour drag and drop
dragClass.each(function(el){   // J'utilise deux fois la classe 'boxin'
	el.makeDraggable({
	handle: el.getElementsBySelector('.boxinH2')[0], // je fais un handle uniquement sur le titre H2 de ma classe
	container: $('voileId') // je limite le déplacement sur mon body
	});
});

j'ai juste eu a rajouter une div sur mon H2 que j'ai bien sur appelé 'boxinH2' (comme on peut deviner plus haut).
Il y avait peut être plus simple mais je galère un peu en sélection d'élement avec Mootools, par exemple si ça se trouve je n'avais pas besoin de créer un div pour mon H2 ...

KalNex
Modifié par KalNex (11 Feb 2008 - 13:35)