Discussion :

[PrinceMaster77]

J'ai dans ma page trois div avec des noms comme Div1,Div2 et Div3, ces trois div sont déplacable à l'aide d'une fonction Drag and Drop mais mon soucis est que je recherche une fonction me permettant de me donner l'ordre des div?

Merci d'avance.

[MasterOfChakhaL]

de quel ordre parles tu?

si c'est l'ordre dans lequel elles sont traitées par le naviguateur, si tu les récupères avec getElementbyTagname elle devrait être dans le bon ordre (avec toutes les autres div de ta page)

si tu veux l'ordre "graphiquement" tu peux récupérer les coordonnées du coin supérieur gauche avec:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
myDiv = document.getElementById( 'div1' );
var top = myDiv.style.top;
var left = myDiv.style.left;

pour cela, je suppose que tes div sont positionnées en absolute (mais ce doit être le cas puisqu'elles sont déplacables...)

ensuite, à toi d'établir ton classement

[PrinceMaster77]

J'ai une erreur Javascript "Cet objet ne gère pas cette propriété ou cette méthode", et mon code est pourtant tout simple :

PS : J'ai rajouter un champs input me lancant la recherche en bas de page et mon essai est pour le moment réaliser avec mon div "Page1".

code :

function OrdrePage(){
Page1 = document.getElementById("Page1").style.top;
alert(Page1);
}

[MasterOfChakhaL]

"page1" est-il bien l'id de ton div?
as-tu défini des propriétés css pour tes div?

Comme je l'ai dit dans le post précédent, tes divs doivent êtres positionnés pour avoir accès aux propriétés style.top et style.left
(positionné, en css: position:absolute; ou position:relative; )

[PrinceMaster77]

Voici mon code :

<script language="JavaScript" type="text/javascript">
<!--
function OrdrePage(){
Page1 = document.DragAndDrop.getElementById("Page1").style.display;
alert(Page1);
}
//-->
</script>

</head>

<form name="DragAndDrop">
<fieldset id=Demo4>
<legend>Composition du document ADocUtilisateurs</legend>
<div>
<div class=DragContainer id=DragContainer4 overClass="OverDragContainer">
<div class=DragBox name="Page1" id=Page1 overClass="OverDragBox" dragClass="DragDragBox" align="center" onMouseUp="identifier();"><img name="ImgPage1" src="../Img/Ass/adocutilisateurs-001.jpg" height="200px"><br><br><br><b id="Page1">Page #1</b></div>
</div>
</fieldset>
</form>

et l'erreur est toujours la même.

[MasterOfChakhaL]

Voici mon code :
...
<div class=DragBox name="Page1" id=Page1 overClass="OverDragBox" dragClass="DragDragBox" align="center" onMouseUp="identifier();"><img name="ImgPage1" src="../Img/Ass/adocutilisateurs-001.jpg" height="200px"><br><br><br><b id="Page1">Page #1</b></div>

ce n'est pas correct d'avoir deux element avec le même indentifiant (identifiant = implicitement identifiant unique). Peut-être que l'erreur vient de là.
il te manque aussi des guillemets autour de l'id de ton div...
toujours dans ton div, je ne connais pas les attributs dragClass et overClass

un bon début quand tu as des erreurs, c'est de vérifier que a syntaxe est correcte
il existe des validateurs en lignes comme celui du w3c par exemple