Forum d'entraide PHPFrance

salut @tous!
voici mon pb.
Je crée des Div dynmique avec DOM. Il s'affiche très bien.

J'utilise jquery pour dragger les balises DIV mais là tous mes DIV crée avec DOM ne sont pas draggable. En revanche les div deja présent sur la page le sont !

Quel est le problemeS.?
Jquery ne peut-il pas agir sur le DOM?

Voici mon code

Code : Tout sélectionner

//FONCTION POUR CRéE UN CALQUE
      function create(id, obj)
      {
	 interieur=document.getElementById("recois").innerHTML;
	  alert(interieur);
	  document.getElementById("recois").innerHTML=interieur;
        var target = document.getElementById(id);
		
		
		
        var elem = document.createElement(obj);
        var txt = document.createTextNode('Petit test');
		//elem.innerHTML='clic ici pour supp</a>';
		elem.width="500";
		elem.height="500";
		posLeft=200+compteur*100;
		elem.style.left=posLeft;
		elem.style.top=posLeft;
		elem.style.position="absolute";
		elem.style.border="1px solid #000000";
		elem.className="draggable";
        
        elem.appendChild(txt);
        elem.id = 'test'+compteur;
		
        
        //target.appendChild(elem);
		target.appendChild(elem);
		
		compteur+=1;
      }

Le jquery

Code : Tout sélectionner

$(document).ready(function()
	{ 
	 $('DIV').Draggable(
			{
				ghosting:	true,
				opacity:	0.5,
				fx:			300
			}
		);
	    } );

Que faire.?

Salut, 2 choses:

Pourquoi tu t'emm.. t'embarques avec "document.getElementById", alors que tu utilises jquery ?
Tu ne dois pas encore avoir découvert toutes ses richesses.. (que je t'envie..)

Akirs

Code : Tout sélectionner

$('DIV').Draggable( 
         { 
            ghosting:   true, 
            opacity:   0.5, 
            fx:         300 
         } 
      );

Ce code ne s'exécute (pour le moment) qu'au chargement de ta page. Donc, il ne s'applique pas à toutes les divs que tu ajoutes par la suite.

Le truc, c'est de simplement remettre ce bout decode à la fin de ta fonction.

je te conseillerais de vivement approfondir tes connaissances en jquery:
http://visualjquery.com/1.1.2.html
http://www.jquery.info/Danse-avec-jQuery-premier-pas

Pour te faire une idée, toute ta manipulation du dom, je le résume comme ça:

Code : Tout sélectionner

$("#"+id).append("<div class=\"draggable\">petit test</div>");

et le style, dans le css.

Juste pour finir, je remarque que le script est faux, il faut mettre ceci:

Code : Tout sélectionner

$('div#draggable').Draggable( 
         { 
            ghosting:   true, 
            opacity:   0.5, 
            fx:         300 
         } 
      );

(mais la méthode draggable j'ai jamais utilisé).

oui oui je debute

je compil a ma sauce pour essayer de me familiariser avec jquery :p bon c'est pas toujours top mais sa aide a mieux comprendre la chose ^^

Il est un peu tard, je regarde les liens demain et je repost si j'ai tjs des choses pas très clair

Merci !

bon merci bien, je comprend un peu mieux
On ajoute en faite la propriété drag a notre objet crée !

Mais la je fais face au meme problème ou cette solution n'est pas possible. Je m'explique

Avec la bibliotheque je crée une zone selectionnable !
Et quand je crée mes calques avec (maintenant) jquery , l'objet n'es pas selectionable puisqu'il a été crée apres la mise en place de la page

Donc comment faire pour qu'il accepte de selectionner mes élements crée plus tard?

Quand j'aurai résolu ce pb, je pense que je me sentirai un peu plus a l'aise ^^
Merci !

Après chaque création, il faut ré-executer le code qui attache la méthode aux objets:

Code : Tout sélectionner

$('div.draggable').Draggable(
         {
            ghosting:   true,
            opacity:   0.5,
            fx:         300
         }
      );

(il y avait encore une erreur, draggable est une classe et pas un id)

Si j'ai bien suivi, tu devrais placer çà à la fin de la fonction.

no la c'est pu la meme choses...
Le drag marche tres bien mais j'aimerai rendre possible la selection de mon div crée
Pour pouvoir selectionner mes div présent quand la page est crée j'utilise le code suivant:

Code : Tout sélectionner

$('div.msd').Selectable(
	{
		accept : 'draggable',
		opacity : 0.2,
		selectedclass : 'selecteditem',
		helperclass : 'selecthelper',
		onselect : function(serial)
		{
		alert(serial.hash);
		}
	}
);

Le pb c'est que si on ajoute cet fonction dans notre objet crée ... on peut selectionner l'interieur du div au lieu de le selectionner lui !!! lol
Donc comment faire en sorte qu'il soit pris en consideration dans le calque selectionnable ...?

Bon
j'ai crée une fonction qui execute le code de selection. Si je crée des nouveaux div et que j'execute la fonction apres sa marche. Par contre cela ne marche que la premiere fois. En effet si je rajoute encore des div et que je réexecute la fonction .... sa ne marche pas
Que faire.?

Forum d'entraide PHPFrance

DOM et jquery pb

DOM et jquery pb